@font-face {
    font-family: Aeonik-Bold;
    src: url(/_static/fonts/Aeonik/Aeonik-Bold.otf) format("opentype");
    font-display: auto
}
@font-face {
    font-family: Aeonik-Regular;
    src: url(/_static/fonts/Aeonik/Aeonik-Regular.otf) format("opentype");
    font-display: auto
}
@font-face {
    font-family: Aeonik-Medium;
    src: url(/_static/Fonts/Aeonik-Medium.otf) format("opentype");
    font-display: auto
}
@font-face {
    font-family: Aeonik-Light;
    src: url(/_static/Fonts/Aeonik-Light.otf) format("opentype");
    font-display: auto
}
@font-face {
    font-family: Gilroy-light;
    src: url(/_static/Fonts/Gilroy-Light.woff2) format("woff2");
    font-display: auto
}
@font-face {
    font-family: Gilroy-bold;
    src: url(/_static/Fonts/Gilroy-Bold.woff2) format("woff2");
    font-display: auto
}
@font-face {
    font-family: testing;
    src: url(/_static/Uploads/4_lato-v23-latin-regular.ttf) format("truetype");
    font-display: auto
}
@font-face {
    font-family: TestingMultiple;
    src: url(/_static/fonts/Aeonik/Aeonik-Regular.otf) format("opentype");
    font-display: auto
}
@font-face {
    font-family: OpenSans-Bold;
    src: url(/_static/Uploads/1_OpenSans-Bold.ttf) format("truetype");
    font-display: auto;
}
@font-face {
    font-family: Default-Bold;
    src: url(/assets/fonts/Aeonik/Aeonik-Bold.otf) format("opentype");
    font-display: auto;
}
@font-face {
    font-family: Default-Regular;
    src: url(/_static/Uploads/Inter_18pt-Regular.ttf) format("truetype");
    font-display: auto;
}
@font-face {
    font-family: Default-Bold;
    src: url(/assets/fonts/Aeonik/Aeonik-Bold.otf) format("opentype");
    font-display: auto;
}
@font-face {
    font-family: Default-Regular;
    src: url(/_static/Uploads/Inter_18pt-Regular.ttf) format("truetype");
    font-display: auto;
}
@font-face {
    font-family: Default-Regular;
    src: url(/_static/Uploads/Inter_18pt-Regular.ttf) format("truetype");
    font-display: auto;
}
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap');
@font-face {
  font-family: Default-Light;
  src: url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Regular;
  src: url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Bold;
  src: url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@import url('https://fonts.googleapis.com/css2?family=roboto:wght@300;400;500;700&display=swap');
@font-face {
  font-family: Default-Light;
  src: url(https://fonts.googleapis.com/css2?family=roboto:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Regular;
  src: url(https://fonts.googleapis.com/css2?family=roboto:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Bold;
  src: url(https://fonts.googleapis.com/css2?family=roboto:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap');
@font-face {
  font-family: Default-Light;
  src: url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Regular;
  src: url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Bold;
  src: url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap');
@font-face {
  font-family: Default-Light;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Regular;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Bold;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap');
@font-face {
  font-family: Default-Light;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Regular;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Bold;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap');
@font-face {
  font-family: Default-Light;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Regular;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Bold;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;500;700&display=swap');
@font-face {
  font-family: Default-Light;
  src: url(https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Regular;
  src: url(https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Bold;
  src: url(https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@300;400;500;700&display=swap');
@font-face {
  font-family: Default-Light;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Regular;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Bold;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap');
@font-face {
  font-family: Default-Light;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Regular;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face {
  font-family: Default-Bold;
  src: url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap) format("woff2");
  font-display: auto;
}
@font-face{
font-family:Default-Bold;
src:url(/_static/Uploads/Poppins-Bold.ttf)format("truetype");
font-display:auto;
}
@font-face{
font-family:Default-Regular;
src:url(/_static/Uploads/Poppins-Regular.ttf)format("truetype");
font-display:auto;
}
@font-face{
font-family:Default-Light;
src:url(/_static/Uploads/Poppins-Light.ttf)format("truetype");
font-display:auto;
}

@font-face{
font-family:Aeonik-Regular;
src:url(/_static/fonts/Aeonik/Aeonik-Regular.otf)format("opentype");
font-display:auto
}
@font-face{
font-family:Aeonik-Light;
src:url(/_static/Fonts/Aeonik-Light.otf)format("opentype");
font-display:auto
}
@font-face{
font-family:Aeonik-Medium;
src:url(/_static/Fonts/Aeonik-Medium.otf)format("opentype");
font-display:auto
}
@font-face{
font-family:Aeonik-Bold;
src:url(/_static/fonts/Aeonik/Aeonik-Bold.otf)format("opentype");
font-display:auto
}
@font-face{
font-family:Gilroy-light;
src:url(/_static/Fonts/Gilroy-Light.woff2)format("woff2");
font-display:auto
}
@font-face{
font-family:Gilroy-bold;
src:url(/_static/Fonts/Gilroy-Bold.woff2)format("woff2");
font-display:auto
}
@font-face{
font-family:Roboto-Regular;
src:url(/_static/Uploads/Roboto-Regular.ttf)format("truetype");
font-display:auto;
}
@font-face{
font-family:Roboto-Light;
src:url(/_static/Uploads/Roboto-Light.ttf)format("truetype");
font-display:auto;
}
@font-face{
font-family:Roboto-Bold;
src:url(/_static/Uploads/Roboto-Bold.ttf)format("truetype");
font-display:auto;
}
@font-face{
font-family:OpenSans-Regular;
src:url(/_static/Uploads/OpenSans-Regular.ttf)format("truetype");
font-display:auto;
}
@font-face{
font-family:OpenSans-Light;
src:url(/_static/Uploads/OpenSans-Light.ttf)format("truetype");
font-display:auto;
}
@font-face{
font-family:OpenSans-Bold;
src:url(/_static/Uploads/OpenSans-Bold.ttf)format("truetype");
font-display:auto;
}
@font-face {
    font-family: OpenSans-Bold;
    src: url(/_static/Uploads/OpenSans-Bold.ttf) format("truetype");
    font-display: auto;
}
@font-face {
    font-family: OpenSans-Light;
    src: url(/_static/Uploads/OpenSans-Light.ttf) format("truetype");
    font-display: auto;
}
@font-face {
    font-family: MuseoSlab-500;
    src: url(/_static/Uploads/MuseoSlab-500.otf) format("opentype");
    font-display: auto;
}
@font-face {
    font-family: MuseoSlab-100;
    src: url(/_static/Uploads/MuseoSlab-100.otf) format("opentype");
    font-display: auto;
}
@font-face {
    font-family: OpenSans-Regular;
    src: url(/_static/Uploads/OpenSans-Regular.ttf) format("truetype");
    font-display: auto;
}
@font-face {
    font-family: Default-Regular;
    src: url("/_static/Uploads/ITC Mendoza Roman Book Regular.otf") format("opentype");
    font-display: auto;
}
@font-face {
    font-family: Default-Bold;
    src: url("/_static/Uploads/ITC Mendoza Roman Std Bold.otf") format("opentype");
    font-display: auto;
}
@font-face {
    font-family: Default-Light;
    src: url("/_static/Uploads/ITC Mendoza Roman Book Regular.otf") format("truetype");
    font-display: auto;
}
@font-face {
    font-family: Montserrat-Bold;
    src: url(/_static/Uploads/1_Montserrat-Bold.ttf) format("truetype");
    font-display: auto;
}
@font-face {
    font-family: Montserrat-Medium;
    src: url(/_static/Uploads/Montserrat-Medium.ttf) format("truetype");
    font-display: auto;
}

@font-face {
    font-family: ISAM-Default-Regular;
    src: url(/_static/Uploads/Raleway-Regular.ttf) format("truetype");
    font-display: auto;
}
@font-face {
    font-family: ISAM-Default-Bold;
    src: url(/_static/Uploads/Raleway-Bold.ttf) format("truetype");
    font-display: auto;
}
@font-face {
    font-family: ISAM-Default-Light;
    src: url(/_static/Uploads/Raleway-Light.ttf) format("truetype");
    font-display: auto;
}

@font-face {
    font-family: Bisbrick-Regular;
    src: url(/_static/Uploads/Aeonik-Regular.otf) format("opentype");
    font-display: auto;
}
@font-face {
    font-family: Bisbrick-Light;
    src: url(/_static/Uploads/Aeonik-Light.otf) format("opentype");
    font-display: auto;
}
@font-face {
    font-family: Bisbrick-Bold;
    src: url(/_static/Uploads/Aeonik-Bold.otf) format("opentype");
    font-display: auto;
}
.default {
  --bg-color: #FFFFFF;
  --bg-color-rgb: 255,255,255;
  --button-padding: 0.5rem 2rem;
  --button-padding-rgb: ;
  --button-radius: 0.2rem;
  --button-radius-rgb: ;
  --font-content: Default-Regular;
  --font-content-rgb: ;
  --font-heading: Gilroy-Light;
  --font-heading-rgb: ;
  --font-link: Default;
  --font-link-rgb: ;
  --font-size: 1rem;
  --font-size-rgb: ;
  --input-line-height: 2rem;
  --input-line-height-rgb: ;
  --input-radius: 0.2rem;
  --input-radius-rgb: ;
  --negative-color: #FF3131;
  --negative-color-rgb: 255,49,49;
  --neutral-color-0: #FFFFFF;
  --neutral-color-0-rgb: 255,255,255;
  --neutral-color-100: #E9E9EB;
  --neutral-color-100-rgb: 233,233,235;
  --neutral-color-1000: #000000;
  --neutral-color-1000-rgb: 0,0,0;
  --neutral-color-200: #E0E0E0;
  --neutral-color-200-rgb: 224,224,224;
  --neutral-color-400: #BCBCBB;
  --neutral-color-400-rgb: 188,188,187;
  --neutral-color-50: #FAFAF9;
  --neutral-color-50-rgb: 250,250,249;
  --neutral-color-600: #70706F;
  --neutral-color-600-rgb: 112,112,111;
  --neutral-color-800: #2C2C2C;
  --neutral-color-800-rgb: 44,44,44;
  --other--color-BBRed: #FF4B4B;
  --other--color-BBRed-rgb: 255,75,75;
  --positive-color: #32C77C;
  --positive-color-rgb: 50,199,124;
  --primary--color-Toolkit-Grey: #f6f7f9;
  --primary--color-Toolkit-Grey-rgb: 246,247,249;
  --primary-1: #ab29ff;
  --primary-1-rgb: 171,41,204;
  --primary-color-100: #F3F9FE;
  --primary-color-100-rgb: 243,249,254;
  --primary-color-1000: #4499F2;
  --primary-color-1000-rgb: 68,153,242;
  --primary-color-1200: #2A81DC;
  --primary-color-1200-rgb: 42,129,220;
  --primary-color-800: #6CA7ED;
  --primary-color-800-rgb: 108,167,237;
  --raftest-font-size: 20px;
  --raftest-font-size-rgb: ;
  --secondary-1: #bea050;
  --secondary-1-rgb: 190,160,80;
  --secondary-color-100: #ECF0F4;
  --secondary-color-100-rgb: 236,240,244;
  --secondary-color-1000: #08213F;
  --secondary-color-1000-rgb: 8,33,63;
  --secondary-color-200: #D3D9E1;
  --secondary-color-200-rgb: 211,217,225;
  --secondary-color-400: #9FADBD;
  --secondary-color-400-rgb: 159,173,189;
  --secondary-color-50: #F7F9FA;
  --secondary-color-50-rgb: 247,249,250;
  --secondary-color-600: #728398;
  --secondary-color-600-rgb: 114,131,152;
  --secondary-color-800: #354B66;
  --secondary-color-800-rgb: 53,75,102;
  --warning-color: #FEC84C;
  --warning-color-rgb: 254,200,76;
}
.default .h2, .default h2, default .h2, default h2 {
  font-family: Default-Bold;
  text-transform: none;
  text-size: 10px;
  font-size: 20px;
  line-height: 20px;
}
.default .h1, .default h1, default .h1, default h1 {
  font-family: Default-Bold;
  text-transform: capitalize;
  font-size: 24px;
  line-height: 30px;
}
.default .p, .default p, default .p, default p {
  font-family: Default-Regular;
  text-transform: none;
  font-size: 16px;
}
.default .h3, .default h3, default .h3, default h3 {
  font-family: Default-Bold;
  text-transform: none;
  font-size: 18px;
  line-height: 20px;
}
.default .h6, .default h6, default .h6, default h6 {
  font-family: Default-Regular;
  text-transform: none;
  font-size: 50px;
  line-height: 2;
}
.default .Button .button__Primary {
  background-color: var(--primary-color-1200);
  color: var(--bg-color);
  font-family: Default-Regular;
  font-size: 16px;
  border-width: 0;
  border-radius: 5px;
  padding-top: 10px;
  padding-right: 22px;
  padding-bottom: 10px;
  padding-left: 22px;
  text-transform: none;
  border-radius-top-left: 15px;
  border-radius-top-right: 0px;
  border-radius-bottom-left: 0px;
  border-radius-bottom-right: 15px;
  border-radius-select: false;
}
.default .Button .button__Primary:hover {
  background-color: var(--primary-color-1200);
}
.default .Button .button__Primary:active {
  background-color: var(--warning-color);
}
.default .Button .button__Secondary {
  background-color: var(--bg-color);
  border-color: var(--primary-color-1200);
  color: var(--primary-color-1200);
  border-width: 2px;
  border-radius: 5px;
  font-family: Default-Regular;
  font-size: 18px;
  padding-top: 12px;
  padding-right: 25px;
  padding-bottom: 12px;
  padding-left: 25px;
  text-transform: none;
}
.default .Button .button__Secondary:hover {
  background-color: var(--primary-color-100);
}
.default .Button .button__Form__Matrix__Add {
  background-color: var(--primary-color-1000);
  font-size: 16px;
  border-width: 0px;
  border-radius: 5px;
  font-family: Aeonik-Regular;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.default .Button .button__Form__Matrix__Remove {
  background-color: var(--warning-color);
  font-family: Aeonik-Regular;
  font-size: 16px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  border-width: 0px;
  border-radius: 5px;
}
.default .Button .button__Form__Next {
  background-color: var(--primary-color-1200);
  border-color: var(--bg-color);
  color: var(--bg-color);
  border-radius: 5px;
  padding-top: 12px;
  padding-right: 25px;
  padding-bottom: 12px;
  padding-left: 25px;
  font-size: 18px;
  font-family: Default-Regular;
  border-width: 0;
}
.default .Button .button__Form__Next:hover {
  background-color: var(--secondary-color-600);
}
.default .Button .button__Form__Prev {
  background-color: var(--neutral-color-0);
  border-color: var(--primary-color-1200);
  color: var(--primary-color-1200);
  border-radius: 5px;
  padding-top: 12px;
  padding-bottom: 12px;
  padding-right: 25px;
  padding-left: 25px;
  font-size: 18px;
  font-family: Aeonik-Regular;
}
.default .Button .button__Form__Prev:hover {
  border-color: var(--secondary-color-600);
  color: var(--secondary-color-600);
}
.default .Button .button__SAIntaClaus {
  background-color: var(--negative-color);
  color: var(--neutral-color-0);
  font-family: Gilroy-bold;
  font-size: 20px;
  padding-top: 20px;
  padding-right: 40px;
  padding-bottom: 20px;
  padding-left: 40px;
  border-radius: 5px;
  border-width: 0px;
}
.default .Button .button__SAIntaClaus:hover {
  background-color: var(--warning-color);
}
.default .Button .button__Toolkit_Add {
  background-color: var(--primary-color-100);
  color: var(--primary-color-1000);
  font-family: Aeonik-Regular;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  border-width: 0px;
  border-radius: 5px;
}
.default .Button .button__Toolkit_Add:hover {
  background-color: var(--primary-color-100);
  border-color: var(--primary-color-1000);
  padding-top: 9px;
  padding-right: 19px;
  padding-bottom: 9px;
  padding-left: 19px;
  border-width: 1px;
}
.default .Button .button__Toolkit_Primary {
  background-color: var(--primary--color-Toolkit-Grey);
  color: var(--neutral-color-1000);
  font-family: Aeonik-Regular;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  border-width: 0px;
  border-radius: 5px;
  font-size: 14px;
}
.default .Button .button__Toolkit_Primary:hover {
  background-color: var(--secondary-color-200);
}
.default .Button .button__Toolkit_Secondary {
  background-color: var(--primary--color-Name);
  color: var(--neutral-color-1000);
  font-family: Aeonik-Regular;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  border-width: 0px;
  border-radius: 5px;
}
.default .Button .button__Toolkit_Secondary:hover {
  background-color: var(--secondary-color-200);
}
.default .Button .button__Toolkit_Tertiary {
  background-color: var(--neutral-color-0);
  font-family: Aeonik-Regular;
  border-width: 0px;
  border-radius: 5px;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.default .Button .button__Toolkit_Tertiary:hover {
  background-color: var(--secondary-color-200);
}
.default .hide-default-link .hide-default-link a {
  text-decoration: none;
}
.default .BisbrickMaster h1, .default .BisbrickMaster h2, .default .BisbrickMaster h3, .default .BisbrickMaster h4, .default .BisbrickMaster h5, .default .BisbrickMaster h6 {
  font-family: var(--font-heading);
  font-weight: normal;
}
.default .BisbrickMaster h1 {
  font-size: 3.5rem;
  font-family: Gilroy-bold;
  font-style: normal;
  line-height: 65px;
  letter-spacing: -0.01em;
}
.default .BisbrickMaster h2 {
  font-family: Gilroy;
  font-style: normal;
  font-size: 3rem;
  line-height: 56px;
}
.default .BisbrickMaster h4 {
  font-size: 2rem;
  font-family: Aeonik;
  line-height: 48px;
}
.default .BisbrickMaster h5 {
  font-size: 1.5rem;
  font-family: Aeonik;
  line-height: 36px;
}
.default .BisbrickMaster {
  font-family: var(--font-content);
}
.default .BisbrickMaster optgroup, .default .BisbrickMaster select, .default .BisbrickMaster textarea {
  font-family: var(--font-heading) !important;
}
.default .BisbrickMaster input {
  font-family: var(--font-content);
}
.default .BisbrickMaster a {
  font-family: var(--font-link);
  text-decoration: none !important;
  cursor: pointer;
  color: inherit;
}
.BisbrickMaster p {
  font-size: 1rem;
  font-family: Aeonik;
  line-height: 24px;
  letter-spacing: 0.01em;
}
.BisbrickMaster header {
  z-index: 100;
  position: sticky;
  top: 0;
  width: 100%;
  -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
}
.default .top-bar {
  background-color: var(--grey-color);
  padding: 0.25rem;
  color: var(--black-color);
  font-size: var(--font-size);
}
.default .top-bar .top-bar[_ngcontent-lkq-c41] {
  height: 50px;
}
.default .top-bar .top-bar-inner {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  align-self: center;
  /* Responsive layout - when the screen is <576px wide */
}
@media (max-width: 575.98px) {
  .default .top-bar .top-bar-inner {
    flex-direction: column;
  }
}
.default .top-bar .top-bar-inner span {
  font-size: 14px;
}
.default .top-bar .links ul {
  margin-bottom: 0 !important;
  list-style-type: none !important;
  /* Responsive layout - when the screen is <576px wide */
}
@media (max-width: 575.98px) {
  .default .top-bar .links ul {
    padding-left: 0px;
  }
}
.default .top-bar .links ul li {
  list-style-type: none !important;
  display: inline;
  padding: 0 0.5em;
}
.default .top-bar .links ul li a {
  text-transform: none !important;
  font-weight: 500 !important;
  font-family: var(--font-content) !important;
  color: var(--white-color) !important;
  font-size: 14px !important;
}
.default .top-bar .links ul li a:hover {
  text-decoration: underline !important;
}
.default .top-bar .user-info-section {
  font-size: 14px !important;
}
.default .top-bar .user-info-section img {
  height: 20px;
}
.default .top-bar .user-info-section li {
  list-style-type: none;
}
.default .top-bar .user-info-section a {
  text-transform: none !important;
  font-weight: 500 !important;
  font-family: var(--font-content) !important;
  margin-left: 10px;
  font-size: 14px !important;
  /* Responsive layout - when the screen is <576px wide */
}
@media (max-width: 575.98px) {
  .default .top-bar .user-info-section a {
    margin: auto;
    text-align: center;
    display: block;
  }
}
.default .top-bar .user-info-section a:hover {
  color: #6CA7ED !important;
  text-decoration: underline !important;
}
.default .middle-bar {
  background-color: var(--bg-color);
  padding: 1.6rem 0rem;
}
.default .middle-bar .floating-content {
  transform: translateX(-53%) !important;
}
.default .middle-bar .floating-content .DescriptionLink .border-right {
  max-width: 244px;
}
.default .middle-bar-inner {
  display: inline-flex;
  height: 38px;
  width: 100%;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .default .middle-bar-inner {
    justify-content: space-between;
  }
}
.default .middle-bar .logo img {
  height: 85px;
  padding: 0.5rem 1rem;
  /* Responsive layout - when the screen is <576px wide */
}
.default .middle-bar .searching {
  cursor: wait;
}
.default .middle-bar .search-section {
  position: relative;
  display: none !important;
}
@media (min-width: 992px) {
  .default .middle-bar .search-section {
    display: block !important;
  }
}
.default .middle-bar .search-section .search-field {
  position: relative;
  border-radius: var(--input-radius);
  border: none;
  width: 400px;
  padding: 0.5rem 1rem;
}
.default .middle-bar .search-section i {
  font-size: 1.4rem;
  position: absolute;
  top: 8px;
  right: 10px;
  color: var(--darkblue-color);
}
.default .middle-bar .search-section .search-results {
  position: absolute;
  max-height: 250px;
  overflow-y: auto;
  border-width: 1px;
  border-color: var(--black-color);
  background-color: var(--white-color);
  min-width: 100%;
  width: max-content;
  z-index: 50;
}
.default .middle-bar .search-section .search-results button {
  padding: 2px 16px;
  position: relative;
  display: block;
  min-width: 100%;
  border: none;
  background-color: var(--white-color);
  text-align: left;
}
@charset "UTF-8";
.default .navbar {
  padding: 0 !important;
}
.default .navbar .nav-item {
  padding: 0 1rem;
}
.default .navbar .navbar-nav .nav-link {
  color: var(--black-color);
  cursor: pointer;
  font-family: Gilroy-Bold !important;
}
.default .navbar .navbar-nav .nav-link:hover {
  color: var(--primary-color-1200) !important;
}
.default .navbar .nav-link.active,
.default .navbar .nav-link.active-parent,
.default .navbar .show > .nav-link {
  color: var(--primary-color-1200);
  border-bottom: 1px solid var(--primary-color-1200);
}
.default .navbar .navbar-collapse {
  justify-content: center;
}
.default .navbar .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8, %3Csvg viewBox=’0 0 32 32′ xmlns=’http://www.w3.org/2000/svg’%3E%3Cpath stroke=’rgba(0, 0, 0, 0.5)’ stroke-width=’2′ stroke-linecap=’round’ stroke-miterlimit=’10’ d=’M4 8h24M4 16h24M4 24h24’/%3E%3C/svg%3E");
  width: 2.5em;
  height: 2em;
}
.default .navbar .navbar-toggler i {
  color: var(#021e3f);
  font-size: 2.1rem;
}
.default .navbar .navbar-toggler:focus {
  box-shadow: 0 0 0 0rem !important;
}
.BisbrickMaster .hero_banner .jumbotron {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.BisbrickMaster .hero_banner .jumbotron h1 {
  color: var(--white-color);
  font-size: 2.5em;
}
.BisbrickMaster .hero_banner .jumbotron h1 span {
  font-weight: 300;
}
.BisbrickMaster .IconTextCard .card {
  border: 0px !important;
}
.BisbrickMaster .IconTextCard .card .div-as-link .card-body .card-title {
  font-size: 1.4rem !important;
  font-weight: bold !important;
  color: var(--base-color);
  /* Responsive layout - when the screen is <576px wide */
}
@media (max-width: 575.98px) {
  .BisbrickMaster .IconTextCard .card .div-as-link .card-body .card-title {
    font-size: 1.1rem !important;
  }
}
.BisbrickMaster .BisbrickNieuwsbriefInschrijving span {
  color: white;
}
.BisbrickMaster .BisbrickNieuwsbriefInschrijving .sv_main .sv_container .sv_body .sv_p_root .sv_q {
  padding: 0;
  box-sizing: border-box;
  overflow: auto;
}
.BisbrickMaster .MultiColumn .sv_main .sv_container .sv_body .sv_p_root .sv_q {
  padding: 8px 0;
  box-sizing: border-box;
  overflow: auto;
}
.BisbrickMaster .MultiColumn .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.BisbrickMaster .form-control:focus {
  border-color: transparent !important;
  box-shadow: none !important;
  outline: none;
}
.BisbrickMaster .accordion {
  list-style-type: none;
  padding: 0;
  margin: 0;
  font-family: "Aeonik";
  display: flex;
  flex-direction: column;
  flex: 1;
  width: 100%;
}
@media (min-width: 992px) {
  .BisbrickMaster .accordion {
    display: none;
  }
}
.BisbrickMaster .accordion .main-menu {
  background-color: #FFFFFF;
  padding: 0.7rem 1rem;
}
.BisbrickMaster .accordion .main-menu .main-menu-item,
.BisbrickMaster .accordion .main-menu a {
  color: #2C2C2C;
  text-transform: uppercase;
  font-size: 1rem;
}
.BisbrickMaster .accordion .main-menu .sub-menu {
  list-style-type: none;
  margin-left: -1rem;
  margin-right: -1rem;
  font-family: "Aeonik";
  font-weight: bold;
  display: flex;
  flex-direction: column;
  flex: 1;
  background-color: #F1F7FC;
}
.BisbrickMaster .accordion .main-menu .sub-menu .sub-menu-link {
  color: #F85600;
}
.BisbrickMaster .accordion .main-menu .sub-menu .sub-menu-item {
  padding: 0.8rem 1rem 0.5rem 0rem;
  text-transform: uppercase;
  font-size: 0.9rem;
  display: flex;
  justify-content: space-between;
  align-content: center;
  align-self: center;
  flex: 1;
  flex-wrap: wrap;
}
.BisbrickMaster .accordion .main-menu .sub-menu .sub-menu-item .menu-icon {
  width: 30px;
  margin-left: 1rem;
}
.BisbrickMaster .accordion .main-menu .sub-menu .sub-menu-item .sub-sub-menu-item {
  list-style-type: none;
  display: block;
  width: 100%;
}
.BisbrickMaster .accordion .main-menu .sub-menu .sub-menu-item .sub-sub-menu-item li a,
.BisbrickMaster .accordion .main-menu .sub-menu .sub-menu-item .sub-sub-menu-item li span {
  color: #1B1B1B;
  font-size: 0.8rem;
  font-weight: 500;
}
.BisbrickMaster .accordion .main-menu .menu-item-with-subitem-0,
.BisbrickMaster .accordion .main-menu .menu-item-with-subitem-1 {
  color: #F5F4F2;
  text-transform: uppercase;
  font-size: 0.9rem;
  list-style-type: none;
  padding: 0.7rem 0 0.7rem 2.5rem;
  margin: 0 0 0 -2rem;
}
.BisbrickMaster .accordion .main-menu .menu-item-with-subitem-0 {
  background-color: #00C2F2;
}
.BisbrickMaster .accordion .main-menu .menu-item-with-subitem-1 {
  background-color: #1B1B1B;
}
.BisbrickMaster .accordion .main-menu .menu-item-with-subitem-sub {
  list-style-type: none;
  background-color: #F1F7FC;
  color: #F85600;
  text-transform: uppercase;
  font-size: 0.8rem;
  margin-left: -3rem;
  margin-bottom: -0.8rem;
  margin-top: 0.7rem;
}
.BisbrickMaster .accordion .main-menu .menu-item-with-subitem-sub .menu-icon {
  width: 30px;
  margin-left: 1rem;
}
.BisbrickMaster .accordion .main-menu .menu-item-with-subitem-sub li {
  display: flex;
  justify-content: space-between;
  align-content: center;
  align-self: center;
  flex: 1;
  flex-wrap: wrap;
  padding: 0.8rem 1rem 0.5rem 1rem;
}
.BisbrickMaster .accordion .main-menu .menu-item-with-subitem-sub .menu-item-with-subitem-sub-sub {
  list-style-type: none;
  display: block;
  width: 100%;
  margin-left: -1.5rem;
}
.BisbrickMaster .accordion .main-menu .menu-item-with-subitem-sub .menu-item-with-subitem-sub-sub li a,
.BisbrickMaster .accordion .main-menu .menu-item-with-subitem-sub .menu-item-with-subitem-sub-sub li span {
  color: #1B1B1B;
  font-size: 0.8rem;
  font-weight: 500;
}
.BisbrickMaster .Button .button__Bisbrick__primary-default {
  height: 56px;
  background: linear-gradient(225deg, #3C98F2 0%, #3570F4 100%);
  box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.15);
  border-radius: 8px;
  color: var(--neutral-color-0) !important;
  padding: 16px 32px;
  font-size: 16px;
  font-family: Aeonik-Regular;
  cursor: pointer;
}
.BisbrickMaster .Button .button__Bisbrick__primary-default:hover {
  box-shadow: none;
  background: #3C98F2;
}
.BisbrickMaster .Button .button__Bisbrick__primary-accent {
  height: 56px;
  background: linear-gradient(225deg, #FF4B4B 0%, #FF6532 100%);
  box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.15);
  border-radius: 8px;
  color: var(--neutral-color-0) !important;
  padding: 16px 32px;
  font-size: 16px;
  font-family: Aeonik-Regular;
}
.BisbrickMaster .Button .button__Bisbrick__primary-accent:hover {
  box-shadow: none;
  background: #FF6532;
}
.BisbrickMaster .Button .button__Bisbrick__secondary-default {
  height: 56px;
  border: 2px solid #3C98F2;
  box-sizing: border-box;
  filter: drop-shadow(3px 3px 6px rgba(0, 0, 0, 0.15));
  border-radius: 8px;
  padding: 14px 32px;
  font-size: 16px;
  font-family: Aeonik-Regular !important;
  color: #3C98F2;
}
.BisbrickMaster .Button .button__Bisbrick__secondary-default:hover {
  box-shadow: none;
  background: #3C98F2;
  color: var(--neutral-color-0);
}
.BisbrickMaster .Button .button__Bisbrick__diap-default {
  height: 56px;
  color: #FFFFFF !important;
  background-color: transparent;
  border: 2px solid white;
  box-sizing: border-box;
  border-radius: 8px;
  padding: 14px 32px;
  font-size: 16px;
  font-family: Aeonik-Regular !important;
  transition: all 0.2s ease-in-out;
}
.BisbrickMaster .Button .button__Bisbrick__diap-default:hover {
  border: 2px solid #3C98F2;
  color: #3C98F2 !important;
}
@charset "UTF-8";
.EuroloopMaster header {
  z-index: 100;
  position: sticky;
  top: 0;
  width: 100%;
  -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
}
.EuroloopMaster .navbar {
  padding: 0 !important;
}
.EuroloopMaster .navbar .nav-item {
  padding: 0 1rem;
}
.EuroloopMaster .navbar .navbar-nav .nav-link {
  color: var(--black-color) !important;
  cursor: pointer;
  font-family: var(--font-link) !important;
}
.EuroloopMaster .navbar .navbar-nav .nav-link:hover {
  color: #6CA7ED !important;
}
.EuroloopMaster .navbar .nav-link.active,
.EuroloopMaster .navbar .nav-link.active-parent,
.EuroloopMaster .navbar .show > .nav-link {
  font-weight: bold;
  border-bottom: 1px solid var(--base-color);
}
.EuroloopMaster .navbar .navbar-collapse {
  justify-content: center;
}
.EuroloopMaster .navbar .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8, %3Csvg viewBox=’0 0 32 32′ xmlns=’http://www.w3.org/2000/svg’%3E%3Cpath stroke=’rgba(0, 0, 0, 0.5)’ stroke-width=’2′ stroke-linecap=’round’ stroke-miterlimit=’10’ d=’M4 8h24M4 16h24M4 24h24’/%3E%3C/svg%3E");
  width: 2.5em;
  height: 2em;
}
.EuroloopMaster .navbar .navbar-toggler i {
  color: var(--black-color);
  font-size: 2rem;
}
.EuroloopMaster .navbar .navbar-toggler:focus {
  box-shadow: 0 0 0 0rem !important;
}
.EuroloopMaster .top-bar {
  background-color: var(--grey-color);
  padding: 0.25rem;
  color: var(--black-color);
  font-size: var(--font-size);
}
.EuroloopMaster .top-bar .top-bar-inner {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  align-self: center;
  /* Responsive layout - when the screen is <576px wide */
}
@media (max-width: 575.98px) {
  .EuroloopMaster .top-bar .top-bar-inner {
    flex-direction: column;
  }
}
.EuroloopMaster .top-bar .top-bar-inner span {
  font-size: 14px;
}
.EuroloopMaster .top-bar .links ul {
  margin-bottom: 0 !important;
  list-style-type: none !important;
  /* Responsive layout - when the screen is <576px wide */
}
@media (max-width: 575.98px) {
  .EuroloopMaster .top-bar .links ul {
    padding-left: 0px;
  }
}
.EuroloopMaster .top-bar .links ul li {
  list-style-type: none !important;
  display: inline;
  padding: 0 0.5em;
}
.EuroloopMaster .top-bar .links ul li a {
  text-transform: none !important;
  font-weight: 500 !important;
  font-family: var(--font-content) !important;
  color: var(--white-color) !important;
  font-size: 14px !important;
}
.EuroloopMaster .top-bar .links ul li a:hover {
  text-decoration: underline !important;
}
.EuroloopMaster .top-bar .user-info-section {
  font-size: 14px !important;
}
.EuroloopMaster .top-bar .user-info-section img {
  height: 20px;
}
.EuroloopMaster .top-bar .user-info-section li {
  list-style-type: none;
}
.EuroloopMaster .top-bar .user-info-section a {
  text-transform: none !important;
  font-weight: 500 !important;
  font-family: var(--font-content) !important;
  margin-left: 10px;
  font-size: 14px !important;
  /* Responsive layout - when the screen is <576px wide */
}
@media (max-width: 575.98px) {
  .EuroloopMaster .top-bar .user-info-section a {
    margin: auto;
    text-align: center;
    display: block;
  }
}
.EuroloopMaster .top-bar .user-info-section a:hover {
  color: #6CA7ED !important;
  text-decoration: underline !important;
}
.EuroloopMaster .middle-bar {
  background-color: var(--bg-color);
  padding: 1.5rem 0rem;
}
.EuroloopMaster .middle-bar-inner {
  display: inline-flex;
  height: 35px;
  width: 100%;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .EuroloopMaster .middle-bar-inner {
    justify-content: space-between;
  }
}
.EuroloopMaster .middle-bar .logo img {
  height: 35px;
  /* Responsive layout - when the screen is <576px wide */
}
.EuroloopMaster .middle-bar .searching {
  cursor: wait;
}
.EuroloopMaster .middle-bar .search-section {
  position: relative;
  display: none !important;
}
@media (min-width: 992px) {
  .EuroloopMaster .middle-bar .search-section {
    display: block !important;
  }
}
.EuroloopMaster .middle-bar .search-section .search-field {
  position: relative;
  border-radius: var(--input-radius);
  border: none;
  width: 400px;
  padding: 0.5rem 1rem;
}
.EuroloopMaster .middle-bar .search-section i {
  font-size: 1.3rem;
  position: absolute;
  top: 8px;
  right: 10px;
  color: var(--darkblue-color);
}
.EuroloopMaster .middle-bar .search-section .search-results {
  position: absolute;
  max-height: 200px;
  overflow-y: auto;
  border-width: 1px;
  border-color: var(--black-color);
  background-color: var(--white-color);
  min-width: 100%;
  width: max-content;
  z-index: 50;
}
.EuroloopMaster .middle-bar .search-section .search-results button {
  padding: 2px 16px;
  position: relative;
  display: block;
  min-width: 100%;
  border: none;
  background-color: var(--white-color);
  text-align: left;
}
.default .BisbrickMaster .language-container {
  position: relative;
}
.default .BisbrickMaster .language-container .language-select-label {
  position: absolute;
  pointer-events: none;
}
.default .BisbrickMaster .language-container .language-select {
  padding: 0 0 0 16px;
  border: none;
  appearance: none;
  background-color: transparent;
}
@media (max-width: 992px) {
  .default .BisbrickMaster bisbrick-language {
    position: absolute;
    top: 0;
    left: 0;
  }
}
@media print {
  .default .col-md-1, .default .col-md-2, .default .col-md-3, .default .col-md-4, .default .col-md-5, .default .col-md-6, .default .col-md-7, .default .col-md-8, .default .col-md-9, .default .col-md-10, .default .col-md-11, .default .col-md-12 {
    float: left;
  }
  .default .col-md-12 {
    width: 100%;
  }
  .default .col-md-11 {
    width: 91.66666667%;
  }
  .default .col-md-10 {
    width: 83.33333333%;
  }
  .default .col-md-9 {
    width: 75%;
  }
  .default .col-md-8 {
    width: 66.66666667%;
  }
  .default .col-md-7 {
    width: 58.33333333%;
  }
  .default .col-md-6 {
    width: 50%;
  }
  .default .col-md-5 {
    width: 41.66666667%;
  }
  .default .col-md-4 {
    width: 33.33333333%;
  }
  .default .col-md-3 {
    width: 25%;
  }
  .default .col-md-2 {
    width: 16.66666667%;
  }
  .default .col-md-1 {
    width: 8.33333333%;
  }
}
.default .master-search .sv_main {
  width: 350px;
}
.default .master-search .sv_main .sd-body {
  padding: 0 !important;
}
.default .master-search .sd-action-bar {
  overflow: visible;
  margin-top: 0;
  padding: 0 !important;
}
.default .master-search .sv_nav {
  padding: 0 !important;
}
.default .master-search #sv-nav-complete {
  margin: 0 16px;
  position: absolute;
  right: -64px;
  top: 1px;
  z-index: 1;
}
.default .master-search .sv_q_text_root {
  width: 200px !important;
}
@media (max-width: 757.98px) {
  .default .ParagraphText-Image-Left .row {
    flow-direction: column-reverse;
  }
}
.default .BisbrickMaster .grayscaleOnHover img {
  -webkit-filter: grayscale(0);
  /* Safari 6.0 - 9.0 */
  filter: grayscale(0);
  transition: filter 0.3s ease;
  /* Optional: for a smooth transition effect */
  z-index: 0 !important;
}
.default .BisbrickMaster .grayscaleOnHover img:hover {
  -webkit-filter: grayscale(100%);
  /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
}
.default .BisbrickMaster .imageBlurOnHover img {
  z-index: 0 !important;
}
.default .BisbrickMaster .imageBlurOnHover img:hover {
  -webkit-filter: blur(5px);
  /* Safari 6.0 - 9.0 */
  filter: blur(5px);
}
.default .blurImageDuringRendering {
  /* Initial blur effect on the image */
  /* Define the keyframes for the unblur animation */
}
.default .blurImageDuringRendering img {
  -webkit-filter: blur(5px);
  /* Safari 6.0 - 9.0 */
  filter: blur(5px);
  animation: unblur 2s ease-out forwards;
  /* Apply the animation */
}
@keyframes unblur {
  0% {
    -webkit-filter: blur(5px);
    /* Safari 6.0 - 9.0 */
    filter: blur(5px);
  }
  100% {
    -webkit-filter: blur(0px);
    /* Safari 6.0 - 9.0 */
    filter: blur(0px);
  }
}
.default .BisbrickMaster .shakeOnHover {
  /* Define the shake animation */
}
.default .BisbrickMaster .shakeOnHover img {
  z-index: 0 !important;
}
.default .BisbrickMaster .shakeOnHover img:hover {
  animation: shake 0.5s;
  /* Animation name and duration */
}
@keyframes shake {
  0% {
    transform: translateX(0);
  }
  10% {
    transform: translateX(-10px);
  }
  20% {
    transform: translateX(10px);
  }
  30% {
    transform: translateX(-10px);
  }
  40% {
    transform: translateX(10px);
  }
  50% {
    transform: translateX(-10px);
  }
  60% {
    transform: translateX(10px);
  }
  70% {
    transform: translateX(-10px);
  }
  80% {
    transform: translateX(10px);
  }
  90% {
    transform: translateX(-10px);
  }
  100% {
    transform: translateX(0);
  }
}
.default .BisbrickMaster .AspectRatio .columnRight, .default .BisbrickMaster .AspectRatio .columntLeft {
  width: 100%;
  aspect-ratio: 16/17;
  background-color: #e0e0e0;
}
.default .hide-default-link .hide-default-link a {
  text-decoration: none;
}
.default .grecaptcha-badge {
  visibility: hidden;
}
.default .customCheckbox .custom-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}
.default .customCheckbox .custom-checkbox input[type=checkbox] {
  appearance: none;
  width: 18px;
  height: 18px;
  border: 2px solid #888;
  border-radius: 4px;
  background-color: transparent;
  transition: all 0.2s ease;
  padding: 4px 4px;
}
.default .customCheckbox .custom-checkbox input[type=checkbox]:checked {
  background-color: #007bff;
  border-color: #007bff;
}
.default .right-container-column {
  display: flex;
  justify-content: right;
}
.default .koostable {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  border: 1px solid var(--neutral-color-200, #e0e0e0);
  border-radius: 10px;
  overflow: hidden;
  font-family: inherit;
  font-size: 13px;
  color: var(--neutral-color-1000, #1f2937);
}

.default .koostable thead,
.default .koostable .sd-table__cell--header,
.default .koostable th,
.default .koostable thead th {
  background: var(--primary-color-1200);
  color: var(--primary--color-Toolkit-Grey);
  font-size: 13px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: normal;
  border-bottom: 1px solid var(--neutral-color-200, #e0e0e0);
  text-align: left;
}

.default .koostable .sd-table__cell,
.default .koostable td,
.default .koostable th {
  padding: 16px 20px;
  font-size: 13px;
  text-align: left;
  vertical-align: middle;
  border: none;
}

.default .koostable tbody tr:nth-child(even),
.default .koostable .sd-table__row:nth-child(even) {
  background: rgba(8, 33, 63, 0.025);
}

.default .koostable tbody tr:hover,
.default .koostable .sd-table__row:hover {
  background: var(--secondary-color-200);
}

.default .koostable thead tr:first-child > th:first-child,
.default .koostable thead tr:first-child > .sd-table__cell:first-child {
  border-top-left-radius: 10px;
}
.default .koostable thead tr:first-child > th:last-child,
.default .koostable thead tr:first-child > .sd-table__cell:last-child {
  border-top-right-radius: 10px;
}
.default .koostable tbody tr:last-child > td:first-child,
.default .koostable tbody tr:last-child > .sd-table__cell:first-child {
  border-bottom-left-radius: 10px;
}
.default .koostable tbody tr:last-child > td:last-child,
.default .koostable tbody tr:last-child > .sd-table__cell:last-child {
  border-bottom-right-radius: 10px;
}

.default .koostable tbody tr.sd-table__row--selected,
.default .koostable .sd-table__row--selected {
  background: var(--primary-color-100, #f3f9fe);
  color: var(--neutral-color-1000, #1f2937);
}

.default .koostable tbody tr:focus-within,
.default .koostable .sd-table__row:focus-within {
  outline: 2px solid var(--primary-color-1000, #4499f2);
  outline-offset: -2px;
}

@media (max-width: 757.98px) {
  .default .koostable {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}
.default .petertable {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  border: 1px solid var(--neutral-color-200, #e0e0e0);
  border-radius: 15px;
  overflow: hidden;
  font-family: var(--font-content, inherit);
  font-size: 16px;
  color: var(--neutral-color-1000, #1f2937);
}

.default .petertable thead,
.default .petertable .sd-table__cell--header,
.default .petertable th,
.default .petertable thead th {
  background: var(--primary-color-1000, #4499f2);
  color: var(--neutral-color-0, #ffffff);
  font-size: 16px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-bottom: 1px solid var(--neutral-color-200, #e0e0e0);
  text-align: center;
}

.default .petertable .sd-table__cell,
.default .petertable td,
.default .petertable th {
  padding: 16px 20px;
  font-size: 16px;
  text-align: center;
  vertical-align: middle;
  border: none;
}

.default .petertable tbody tr:nth-child(even),
.default .petertable .sd-table__row:nth-child(even) {
  background: var(--neutral-color-50, #fafaf9);
}

.default .petertable tbody tr:hover,
.default .petertable .sd-table__row:hover {
  background: var(--warning-color);
}

.default .petertable thead tr:first-child > th:first-child,
.default .petertable thead tr:first-child > .sd-table__cell:first-child {
  border-top-left-radius: 15px;
}
.default .petertable thead tr:first-child > th:last-child,
.default .petertable thead tr:first-child > .sd-table__cell:last-child {
  border-top-right-radius: 15px;
}
.default .petertable tbody tr:last-child > td:first-child,
.default .petertable tbody tr:last-child > .sd-table__cell:first-child {
  border-bottom-left-radius: 15px;
}
.default .petertable tbody tr:last-child > td:last-child,
.default .petertable tbody tr:last-child > .sd-table__cell:last-child {
  border-bottom-right-radius: 15px;
}

.default .petertable tbody tr.sd-table__row--selected,
.default .petertable .sd-table__row--selected {
  background: var(--secondary-color-200);
  color: var(--neutral-color-1000, #1f2937);
}

.default .petertable tbody tr:focus-within,
.default .petertable .sd-table__row:focus-within {
  outline: 2px solid var(--primary-color-1000, #4499f2);
  outline-offset: -2px;
}

@media (max-width: 757.98px) {
  .default .petertable {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

.test-rein {
  --primary-color-1200: #2A81DC;
  --primary-color-1200-rgb: 42,129,220;
  --primary-color-1000: #4499F2;
  --primary-color-1000-rgb: 68,153,242;
  --primary-color-800: #6CA7ED;
  --primary-color-800-rgb: 108,167,237;
  --primary-color-100: #F3F9FE;
  --primary-color-100-rgb: 243,249,254;
  --secondary-color-1000: #08213F;
  --secondary-color-1000-rgb: 8,33,63;
  --secondary-color-800: #354B66;
  --secondary-color-800-rgb: 53,75,102;
  --secondary-color-600: #728398;
  --secondary-color-600-rgb: 114,131,152;
  --secondary-color-400: #9FADBD;
  --secondary-color-400-rgb: 159,173,189;
  --secondary-color-200: #D3D9E1;
  --secondary-color-200-rgb: 211,217,225;
  --secondary-color-100: #ECF0F4;
  --secondary-color-100-rgb: 236,240,244;
  --secondary-color-50: #F7F9FA;
  --secondary-color-50-rgb: 247,249,250;
  --neutral-color-1000: #000000;
  --neutral-color-1000-rgb: 0,0,0;
  --neutral-color-800: #2C2C2C;
  --neutral-color-800-rgb: 44,44,44;
  --neutral-color-600: #70706F;
  --neutral-color-600-rgb: 112,112,111;
  --neutral-color-400: #BCBCBB;
  --neutral-color-400-rgb: 188,188,187;
  --neutral-color-200: #E0E0E0;
  --neutral-color-200-rgb: 224,224,224;
  --neutral-color-100: #E9E9EB;
  --neutral-color-100-rgb: 233,233,235;
  --neutral-color-50: #FAFAF9;
  --neutral-color-50-rgb: 250,250,249;
  --neutral-color-0: #FFFFFF;
  --neutral-color-0-rgb: 255,255,255;
  --positive-color: #32C77C;
  --positive-color-rgb: 50,199,124;
  --warning-color: #FEC84C;
  --warning-color-rgb: 254,200,76;
  --negative-color: #FF3131;
  --negative-color-rgb: 255,49,49;
  --button-padding: 0.5rem 2rem;
  --button-padding-rgb: ;
  --button-radius: 0.25rem;
  --button-radius-rgb: ;
  --input-radius: 0.2rem;
  --input-radius-rgb: ;
  --input-line-height: 3rem;
  --input-line-height-rgb: ;
  --font-content: Aeonik;
  --font-content-rgb: ;
  --font-heading: Gilroy;
  --font-heading-rgb: ;
  --font-link: Aeonik;
  --font-link-rgb: ;
  --font-size: 1rem;
  --font-size-rgb: ;
  --bg-color: #FFFFFF;
  --bg-color-rgb: 255,255,255;
  --primary--color-test_100: #FFFF00;
  --primary--color-test_100-rgb: 255,255,0;
  --other--color-Test4: #Fdfd;
  --other--color-Test4-rgb: ;
}
.TestRein .h3, .TestRein h3, TestRein .h3, TestRein h3 {
  font-family: TestingMultiple;
  font-size: 16vmin;
  text-transform: uppercase;
}
.TestRein .h4, .TestRein h4, TestRein .h4, TestRein h4 {
  font-family: testing;
  font-size: 10px;
}
.TestRein .Button .test {
  background-color: var(--primary-color-1000);
  border-color: var(--neutral-color-600);
  color: var(--positive-color);
}
.TestRein .Button .button__Secondary {
  background-color: var(--neutral-color-0);
  border-color: var(--primary-color-1000);
  color: var(--primary-color-1000);
  border-radius: 8px;
  font-size: 24px;
  line-height: 1.2em;
  letter-spacing: 0.1em;
  padding-top: 16px;
  padding-right: 8px;
  padding-bottom: 16px;
  padding-left: 8px;
  border-width: 2px;
  font-family: OpenSans-Bold;
  text-transform: uppercase;
}
.TestRein .test {
  width: 100%;
}
.TestRein .test {
  width: 100%;
}
.defaultTestHamedOld {
  --primary--color-1: #6553e7;
  --primary--color-1-rgb: 68,153,242;
  --primary--color-dark-1: #2A81DC;
  --primary--color-dark-1-rgb: 42,129,220;
  --primary--color-light-1: #6CA7ED;
  --primary--color-light-1-rgb: 108,167,237;
  --secondary--color-dark-1: #08213F;
  --secondary--color-dark-1-rgb: 8,33,63;
  --secondary--color-1: #354B66;
  --secondary--color-1-rgb: 53,75,102;
  --secondary--color-light-1: #728398;
  --secondary--color-light-1-rgb: 114,131,152;
  --neutral--color-1: #000000;
  --neutral--color-1-rgb: 0,0,0;
  --neutral--color-2: #BCBCBC;
  --neutral--color-2-rgb: 188,188,188;
  --neutral--color-3: #E9E9E9;
  --neutral--color-3-rgb: 233,233,233;
  --neutral--color-Name: #0000FF;
  --neutral--color-Name-rgb: 0,0,255;
  --primary--color-Name: #FF0000;
  --primary--color-Name-rgb: 255,0,0;
  --secondary--color-Name: #00FF00;
  --secondary--color-Name-rgb: 0,255,0;
}
.defaultTestHamed .h2, .defaultTestHamed h2, defaultTestHamed .h2, defaultTestHamed h2 {
  font-family: Default-Bold;
  text-transform: none;
  text-size: 10px;
  font-size: 20px;
  line-height: 20px;
}
.defaultTestHamed .h1, .defaultTestHamed h1, defaultTestHamed .h1, defaultTestHamed h1 {
  font-family: Default-Bold;
  text-transform: capitalize;
  font-size: 24px;
  line-height: 30px;
}
.defaultTestHamed .p, .defaultTestHamed p, defaultTestHamed .p, defaultTestHamed p {
  font-family: Default-Regular;
  text-transform: none;
  font-size: 16px;
}
.defaultTestHamed .h3, .defaultTestHamed h3, defaultTestHamed .h3, defaultTestHamed h3 {
  font-family: Default-Bold;
  text-transform: none;
  font-size: 18px;
  line-height: 20px;
}
.defaultTestHamed .h6, .defaultTestHamed h6, defaultTestHamed .h6, defaultTestHamed h6 {
  font-family: Default-Regular;
  text-transform: none;
  font-size: 5px;
}
.defaultTestHamed .Button .button__Form__Matrix__Remove {
  background-color: var(--warning-color);
  font-family: Aeonik-Regular;
  font-size: 16px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  border-width: 0px;
  border-radius: 5px;
}
.defaultTestHamed .Button .button__Form__Next {
  background-color: var(--neutral-color-0);
  border-color: var(--primary-color-1000);
  color: var(--primary-color-1000);
  border-radius: 5px;
  padding-top: 7px;
  padding-right: 20px;
  padding-bottom: 7px;
  padding-left: 20px;
  font-size: 16px;
  font-family: Aeonik-Regular;
}
.defaultTestHamed .Button .button__Form__Next:hover {
  background-color: var(--neutral-color-100);
  font-size: 16px;
}
.defaultTestHamed .Button .button__Form__Matrix__Add {
  background-color: var(--primary-color-1000);
  font-size: 16px;
  border-width: 0px;
  border-radius: 5px;
  font-family: Aeonik-Regular;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.defaultTestHamed .Button .button__Primary {
  background-color: var(--primary-color-1200);
  color: var(--bg-color);
  font-family: Default-Bold;
  font-size: 18px;
  border-width: 0;
  border-radius: 5px;
  padding-top: 12px;
  padding-right: 25px;
  padding-bottom: 12px;
  padding-left: 25px;
}
.defaultTestHamed .Button .button__Primary:hover {
  background-color: var(--secondary-color-200);
}
.defaultTestHamed .Button .button__Secondary {
  background-color: var(--bg-color);
  border-color: var(--primary-color-1200);
  color: var(--primary-color-1200);
  border-width: 2px;
  border-radius: 5px;
  font-family: Default-Bold;
  font-size: 18px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.defaultTestHamed .Button .button__Secondary:hover {
  background-color: var(--primary-color-100);
}
.defaultTestHamed .Button .button__Toolkit_Primary {
  background-color: var(--primary--color-Toolkit-Grey);
  color: var(--neutral-color-1000);
  font-family: Aeonik-Regular;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  border-width: 0px;
  border-radius: 5px;
  font-size: 14px;
}
.defaultTestHamed .Button .button__Toolkit_Primary:hover {
  background-color: var(--secondary-color-200);
}
.defaultTestHamed .Button .button__Toolkit_Secondary {
  background-color: var(--primary--color-Name);
  color: var(--neutral-color-1000);
  font-family: Aeonik-Regular;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  border-width: 0px;
  border-radius: 5px;
}
.defaultTestHamed .Button .button__Toolkit_Secondary:hover {
  background-color: var(--secondary-color-200);
}
.defaultTestHamed .Button .button__Toolkit_Add {
  background-color: var(--primary-color-100);
  color: var(--primary-color-1000);
  font-family: Aeonik-Regular;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  border-width: 0px;
  border-radius: 5px;
}
.defaultTestHamed .Button .button__Toolkit_Add:hover {
  background-color: var(--primary-color-100);
  border-color: var(--primary-color-1000);
  padding-top: 9px;
  padding-right: 19px;
  padding-bottom: 9px;
  padding-left: 19px;
  border-width: 1px;
}
.defaultTestHamed .Button .button__Toolkit_Tertiary {
  background-color: var(--neutral-color-0);
  font-family: Aeonik-Regular;
  border-width: 0px;
  border-radius: 5px;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.defaultTestHamed .Button .button__Toolkit_Tertiary:hover {
  background-color: var(--secondary-color-200);
}
.defaultTestHamed .Button .button__Form__Prev {
  background-color: var(--neutral-color-0);
  border-color: var(--neutral-color-400);
  color: var(--neutral-color-400);
  border-radius: 5px;
  padding-top: 7px;
  padding-bottom: 7px;
  padding-right: 20px;
  padding-left: 20px;
  font-size: 16px;
  font-family: Aeonik-Regular;
}
.defaultTestHamed .Button .button__SAIntaClaus {
  background-color: var(--negative-color);
  color: var(--neutral-color-0);
  font-family: Gilroy-bold;
  font-size: 20px;
  padding-top: 20px;
  padding-right: 40px;
  padding-bottom: 20px;
  padding-left: 40px;
  border-radius: 5px;
  border-width: 0px;
}
.defaultTestHamed .Button .button__SAIntaClaus:hover {
  background-color: var(--warning-color);
}
.defaultTestHamed .Button .button__TEST_NAME {
  background-color: var(--primary--color-1);
  border-color: var(--neutral--color-1);
  color: var(--neutral--color-1);
  border-width: 1px;
  border-radius: 5px;
  font-family: Default-Regular;
  font-size: 20px;
  line-height: 20px;
  letter-spacing: 2px;
  padding-top: 2px;
  padding-right: 2px;
  padding-bottom: 2px;
  padding-left: 2px;
}
.default .right-container-column {
  display: flex;
  justify-content: right;
}
.defaultTestHamed {
  --other--color-Name: #FFFFFF;
  --other--color-Name-rgb: 255,255,255;
  --rewr: rewr;
  --rewr-rgb: ;
  --secondary--color-1: #354B66;
  --secondary--color-1-rgb: 53,75,102;
  --secondary--color-dark-1: #08213F;
  --secondary--color-dark-1-rgb: 8,33,63;
  --secondary--color-light-1: #728398;
  --secondary--color-light-1-rgb: 114,131,152;
  --secondary--color-Name: #00FF00;
  --secondary--color-Name-rgb: 0,255,0;
  Form-TOC-hover: #123456;
  Form-TOC-hover-rgb: 18,52,86;
  Neutral-1: #000000;
  Neutral-1-rgb: 0,0,0;
  Neutral-2: #BCBCBC;
  Neutral-2-rgb: 188,188,188;
  Neutral-4: #0000FF;
  Neutral-4-rgb: 0,0,255;
  Primary-1: #dc2299;
  Primary-1-rgb: 32,32,35;
  Primary-1-Dark: #FF0000;
  Primary-1-Dark-rgb: 255,0,0;
  Primary-1-Light: #2A81DC;
  Primary-1-Light-rgb: 42,129,220;
  Primary-2: #123456;
  Primary-2-rgb: 18,52,86;
  Primary-2-Dark: #123445;
  Primary-2-Dark-rgb: 18,52,69;
  Primary-2-Light: #123454;
  Primary-2-Light-rgb: 18,52,84;
  Primary-3: #6CA7ED;
  Primary-3-rgb: 108,167,237;
  Primary-3-Dark: #123454;
  Primary-3-Dark-rgb: 18,52,84;
  Primary-3-Light: #123454;
  Primary-3-Light-rgb: 18,52,84;
  Primary-4: #123454;
  Primary-4-rgb: 18,52,84;
  Primary-4-Dark: #123454;
  Primary-4-Dark-rgb: 18,52,84;
  Primary-4-Light: #123454;
  Primary-4-Light-rgb: 18,52,84;
  Primary-5: #123454;
  Primary-5-rgb: 18,52,84;
  Primary-5-Dark: #123454;
  Primary-5-Dark-rgb: 18,52,84;
  Primary-5-Light: tgrstfrs;
  Primary-5-Light-rgb: ;
  Secondary-1: #123456;
  Secondary-1-rgb: 18,52,86;
  test: #1234;
  test-rgb: ;
}
.defaultTestHamed .h1, .defaultTestHamed h1, defaultTestHamed .h1, defaultTestHamed h1 {
  font-family: Default-Bold;
  text-transform: capitalize;
  font-size: 24px;
  line-height: 30px;
}
.defaultTestHamed .h2, .defaultTestHamed h2, defaultTestHamed .h2, defaultTestHamed h2 {
  font-family: Default-Bold;
  text-transform: none;
  text-size: 10px;
  font-size: 20px;
  line-height: 20px;
}
.defaultTestHamed .h3, .defaultTestHamed h3, defaultTestHamed .h3, defaultTestHamed h3 {
  font-family: Default-Bold;
  text-transform: none;
}
.defaultTestHamed .h4, .defaultTestHamed h4, defaultTestHamed .h4, defaultTestHamed h4 {
  font-family: Default-Bold;
  text-transform: none;
}
.defaultTestHamed .Button .button__Primary {
  background-color: var(--secondary--color-Name);
  border-color: var(--secondary--color-Name);
  font-size: 16px;
  border-width: 10px;
  border-radius: 60px;
  font-family: Aeonik-Regular;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.defaultTestHamed .Button .button__Secondary {
  background-color: var(--bg-color);
  border-color: var(--secondary--color-Name);
  color: var(--secondary--color-Name);
  border-width: 2px;
  border-radius: 5px;
  font-family: Default-Bold;
  font-size: 18px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.defaultTestHamed .Button .button__Secondary:hover {
  background-color: var(--primary-color-100);
}
.defaultTestHamed .Button .button__Text {
  background-color: var(--primary-color-1200);
  color: var(--bg-color);
  font-family: Default-Bold;
  font-size: 18px;
  border-width: 0;
  border-radius: 5px;
  padding-top: 12px;
  padding-right: 25px;
  padding-bottom: 12px;
  padding-left: 25px;
}
.defaultTestHamed .Button .button__Text:hover {
  background-color: var(--secondary-color-200);
}
.defaultTestHamed .Button .button__Text:active {
  background-color: var(--secondary--color-Name);
  font-family: Default-Regular;
  font-size: 12px;
  line-height: 3;
  letter-spacing: 4px;
}
.defaultTestHamed .Button .button__Form-Matrix-Add {
  border-radius: 30px;
}
.defaultTestHamed .Button .button__System {
  background-color: var(--primary--color-1);
  border-color: var(--neutral--color-1);
  color: var(--neutral--color-1);
  border-width: 1px;
  border-radius: 5px;
  font-family: Default-Regular;
  font-size: 20px;
  line-height: 20px;
  letter-spacing: 2px;
  padding-top: 2px;
  padding-right: 2px;
  padding-bottom: 2px;
  padding-left: 2px;
}
.defaultTestHamed .Button .button__Form__Matrix__Remove {
  background-color: var(--warning-color);
  font-family: Aeonik-Regular;
  font-size: 16px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  border-width: 0px;
  border-radius: 5px;
}
.defaultTestHamed .Button .button__Form__Next {
  background-color: var(--neutral-color-0);
  border-color: var(--primary-color-1000);
  color: var(--primary-color-1000);
  border-radius: 5px;
  padding-top: 7px;
  padding-right: 20px;
  padding-bottom: 7px;
  padding-left: 20px;
  font-size: 16px;
  font-family: Aeonik-Regular;
}
.defaultTestHamed .Button .button__Form__Next:hover {
  background-color: var(--neutral-color-100);
  font-size: 16px;
}
.defaultTestHamed .Button .button__Form__Prev {
  background-color: var(--neutral-color-0);
  border-color: var(--neutral-color-400);
  color: var(--neutral-color-400);
  border-radius: 5px;
  padding-top: 7px;
  padding-bottom: 7px;
  padding-right: 20px;
  padding-left: 20px;
  font-size: 16px;
  font-family: Aeonik-Regular;
}
.defaultTestHamed .Button .button__SAIntaClaus {
  background-color: var(--negative-color);
  color: var(--neutral-color-0);
  font-family: Gilroy-bold;
  font-size: 20px;
  padding-top: 20px;
  padding-right: 40px;
  padding-bottom: 20px;
  padding-left: 40px;
  border-radius: 5px;
  border-width: 0px;
}
.defaultTestHamed .Button .button__SAIntaClaus:hover {
  background-color: var(--warning-color);
}
.defaultTestHamed .Button .button__Toolkit_Primary {
  background-color: var(--primary--color-Toolkit-Grey);
  color: var(--neutral-color-1000);
  font-family: Aeonik-Regular;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  border-width: 0px;
  border-radius: 5px;
  font-size: 14px;
}
.defaultTestHamed .Button .button__Toolkit_Primary:hover {
  background-color: var(--secondary-color-200);
}
.default .right-container-column {
  display: flex;
  justify-content: right;
}
.hotel-booking {
  Secondary-1-Light: #f2f2f2;
  Secondary-1-Light-rgb: ;
}
.hotel-booking .Button .button__Secondary {
  background-color: var(Secondary-1-Light);
}
.testtheme {
  --clr-primary-1000: #4499f2;
  --clr-primary-1000-rgb: rgb(68, 153, 242);
  --clr-secondary-1000: #0f172a;
  --clr-secondary-1000-rgb: rgb(15, 23, 42);
  --clr-accent-1000: #ff6b6b;
  --clr-accent-1000-rgb: rgb(255, 107, 107);
}
.testkoos {
  --clr-primary-1000: #4499f2;
  --clr-primary-1000-rgb: rgb(68, 153, 242);
  --clr-secondary-1000: #0f172a;
  --clr-secondary-1000-rgb: rgb(15, 23, 42);
  --clr-accent-1000: #ff6b6b;
  --clr-accent-1000-rgb: rgb(255, 107, 107);
}
.triallala {
  --clr-primary-1000: #4499f2;
  --clr-primary-1000-rgb: rgb(68, 153, 242);
  --clr-secondary-1000: #0f172a;
  --clr-secondary-1000-rgb: rgb(15, 23, 42);
  --clr-accent-1000: #ff6b6b;
  --clr-accent-1000-rgb: rgb(255, 107, 107);
}
.kkkoooss {
  --clr-primary-1000: #4499f2;
  --clr-primary-1000-rgb: 68,153,242;
  --clr-secondary-1000: #0f172a;
  --clr-secondary-1000-rgb: 15,23,42;
  --clr-accent-1000: #ff6b6b;
  --clr-accent-1000-rgb: 255,107,107;
}
.kkkoooss {
  .h1, h1 {
    font-family: Poppins;
    font-size: 32px;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 700;
  }
  @media (max-width: 757.98px) {
    .h1, h1 {
      font-family: Poppins;
      font-size: 32px;
      line-height: 1.25;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 700;
    }
  }
  .h2, h2 {
    font-family: Poppins;
    font-size: 26px;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 700;
  }
  @media (max-width: 757.98px) {
    .h2, h2 {
      font-family: Poppins;
      font-size: 26px;
      line-height: 1.25;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 700;
    }
  }
  .h3, h3 {
    font-family: Poppins;
    font-size: 22px;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h3, h3 {
      font-family: Poppins;
      font-size: 22px;
      line-height: 1.3;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h4, h4 {
    font-family: Poppins;
    font-size: 18px;
    line-height: 1.35;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h4, h4 {
      font-family: Poppins;
      font-size: 18px;
      line-height: 1.35;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h5, h5 {
    font-family: Poppins;
    font-size: 16px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h5, h5 {
      font-family: Poppins;
      font-size: 16px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h6, h6 {
    font-family: Poppins;
    font-size: 14px;
    line-height: 1.45;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h6, h6 {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.45;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .paragraph, paragraph {
    font-family: Poppins;
    font-size: 15px;
    line-height: 1.6;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 400;
  }
  @media (max-width: 757.98px) {
    .paragraph, paragraph {
      font-family: Poppins;
      font-size: 15px;
      line-height: 1.6;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 400;
    }
  }
}
.kkkoooss .Button {
  .button__Primary {
    font-family: Poppins;
    font-size: 14px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 20px;
    padding-right: 20px;
    border-width: 1px;
    border-radius: 30px;
    background-color: #4499f2;
    border-color: #4499f2;
    color: #ffffff;
    &:hover {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #d2d2d2;
      border-color: #d2d2d2;
      color: #0f172a;
    }
  }
  @media (max-width: 757.98px) {
    .button__Primary {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #4499f2;
      border-color: #4499f2;
      color: #ffffff;
      &:hover {
        font-family: Poppins;
        font-size: 14px;
        line-height: 1.4;
        letter-spacing: 0;
        text-transform: none;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-left: 20px;
        padding-right: 20px;
        border-width: 1px;
        border-radius: 30px;
        background-color: #d2d2d2;
        border-color: #d2d2d2;
        color: #0f172a;
      }
    }
  }
  .button__Secondary {
    font-family: Poppins;
    font-size: 14px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 20px;
    padding-right: 20px;
    border-width: 1px;
    border-radius: 30px;
    background-color: #0f172a;
    border-color: #0f172a;
    color: #ffffff;
    &:hover {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #d2d2d2;
      border-color: #d2d2d2;
      color: #0f172a;
    }
  }
  @media (max-width: 757.98px) {
    .button__Secondary {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #0f172a;
      border-color: #0f172a;
      color: #ffffff;
      &:hover {
        font-family: Poppins;
        font-size: 14px;
        line-height: 1.4;
        letter-spacing: 0;
        text-transform: none;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-left: 20px;
        padding-right: 20px;
        border-width: 1px;
        border-radius: 30px;
        background-color: #d2d2d2;
        border-color: #d2d2d2;
        color: #0f172a;
      }
    }
  }
}
.koostest {
  --clr-primary-1000: #4499f2;
  --clr-primary-1000-rgb: 68,153,242;
  --clr-secondary-1000: #0f172a;
  --clr-secondary-1000-rgb: 15,23,42;
  --clr-accent-1000: #ff6b6b;
  --clr-accent-1000-rgb: 255,107,107;
}
.koostest {
  .h1, h1 {
    font-family: Poppins;
    font-size: 32px;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 700;
  }
  @media (max-width: 757.98px) {
    .h1, h1 {
      font-family: Poppins;
      font-size: 32px;
      line-height: 1.25;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 700;
    }
  }
  .h2, h2 {
    font-family: Poppins;
    font-size: 26px;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 700;
  }
  @media (max-width: 757.98px) {
    .h2, h2 {
      font-family: Poppins;
      font-size: 26px;
      line-height: 1.25;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 700;
    }
  }
  .h3, h3 {
    font-family: Poppins;
    font-size: 22px;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h3, h3 {
      font-family: Poppins;
      font-size: 22px;
      line-height: 1.3;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h4, h4 {
    font-family: Poppins;
    font-size: 18px;
    line-height: 1.35;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h4, h4 {
      font-family: Poppins;
      font-size: 18px;
      line-height: 1.35;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h5, h5 {
    font-family: Poppins;
    font-size: 16px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h5, h5 {
      font-family: Poppins;
      font-size: 16px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h6, h6 {
    font-family: Poppins;
    font-size: 14px;
    line-height: 1.45;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h6, h6 {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.45;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .paragraph, paragraph {
    font-family: Poppins;
    font-size: 15px;
    line-height: 1.6;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 400;
  }
  @media (max-width: 757.98px) {
    .paragraph, paragraph {
      font-family: Poppins;
      font-size: 15px;
      line-height: 1.6;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 400;
    }
  }
}
.koostest .Button {
  .button__Primary {
    font-family: Poppins;
    font-size: 14px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 20px;
    padding-right: 20px;
    border-width: 1px;
    border-radius: 30px;
    background-color: #4499f2;
    border-color: #4499f2;
    color: #ffffff;
    &:hover {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #d2d2d2;
      border-color: #d2d2d2;
      color: #0f172a;
    }
  }
  @media (max-width: 757.98px) {
    .button__Primary {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #4499f2;
      border-color: #4499f2;
      color: #ffffff;
      &:hover {
        font-family: Poppins;
        font-size: 14px;
        line-height: 1.4;
        letter-spacing: 0;
        text-transform: none;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-left: 20px;
        padding-right: 20px;
        border-width: 1px;
        border-radius: 30px;
        background-color: #d2d2d2;
        border-color: #d2d2d2;
        color: #0f172a;
      }
    }
  }
  .button__Secondary {
    font-family: Poppins;
    font-size: 14px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 20px;
    padding-right: 20px;
    border-width: 1px;
    border-radius: 30px;
    background-color: #0f172a;
    border-color: #0f172a;
    color: #ffffff;
    &:hover {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #d2d2d2;
      border-color: #d2d2d2;
      color: #0f172a;
    }
  }
  @media (max-width: 757.98px) {
    .button__Secondary {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #0f172a;
      border-color: #0f172a;
      color: #ffffff;
      &:hover {
        font-family: Poppins;
        font-size: 14px;
        line-height: 1.4;
        letter-spacing: 0;
        text-transform: none;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-left: 20px;
        padding-right: 20px;
        border-width: 1px;
        border-radius: 30px;
        background-color: #d2d2d2;
        border-color: #d2d2d2;
        color: #0f172a;
      }
    }
  }
}
.basthema {
  --clr-primary-1000: #4499f2;
  --clr-primary-1000-rgb: 68,153,242;
  --clr-secondary-1000: #0f172a;
  --clr-secondary-1000-rgb: 15,23,42;
  --clr-accent-1000: #ff6b6b;
  --clr-accent-1000-rgb: 255,107,107;
  --clr-extra-4-1000: #888888;
  --clr-extra-4-1000-rgb: 136,136,136;
}
.basthema {
  .h1, h1 {
    font-family: Poppins;
    font-size: 32px;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 700;
  }
  @media (max-width: 757.98px) {
    .h1, h1 {
      font-family: Poppins;
      font-size: 32px;
      line-height: 1.25;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 700;
    }
  }
  .h2, h2 {
    font-family: Poppins;
    font-size: 26px;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 700;
  }
  @media (max-width: 757.98px) {
    .h2, h2 {
      font-family: Poppins;
      font-size: 26px;
      line-height: 1.25;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 700;
    }
  }
  .h3, h3 {
    font-family: Poppins;
    font-size: 22px;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h3, h3 {
      font-family: Poppins;
      font-size: 22px;
      line-height: 1.3;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h4, h4 {
    font-family: Poppins;
    font-size: 18px;
    line-height: 1.35;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h4, h4 {
      font-family: Poppins;
      font-size: 18px;
      line-height: 1.35;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h5, h5 {
    font-family: Poppins;
    font-size: 16px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h5, h5 {
      font-family: Poppins;
      font-size: 16px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h6, h6 {
    font-family: Poppins;
    font-size: 14px;
    line-height: 1.45;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h6, h6 {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.45;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .paragraph, paragraph {
    font-family: Poppins;
    font-size: 15px;
    line-height: 1.6;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 400;
  }
  @media (max-width: 757.98px) {
    .paragraph, paragraph {
      font-family: Poppins;
      font-size: 15px;
      line-height: 1.6;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 400;
    }
  }
}
.basthema .Button {
  .button__Primary {
    font-family: Poppins;
    font-size: 14px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 20px;
    padding-right: 20px;
    border-width: 1px;
    border-radius: 6px;
    background-color: #4499f2;
    border-color: #4499f2;
    color: #ffffff;
    &:hover {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 6px;
      background-color: #d2d2d2;
      border-color: #d2d2d2;
      color: #0f172a;
    }
  }
  @media (max-width: 757.98px) {
    .button__Primary {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 6px;
      background-color: #4499f2;
      border-color: #4499f2;
      color: #ffffff;
      &:hover {
        font-family: Poppins;
        font-size: 14px;
        line-height: 1.4;
        letter-spacing: 0;
        text-transform: none;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-left: 20px;
        padding-right: 20px;
        border-width: 1px;
        border-radius: 6px;
        background-color: #d2d2d2;
        border-color: #d2d2d2;
        color: #0f172a;
      }
    }
  }
  .button__Secondary {
    font-family: Poppins;
    font-size: 14px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 20px;
    padding-right: 20px;
    border-width: 1px;
    border-radius: 6px;
    background-color: #0f172a;
    border-color: #0f172a;
    color: #ffffff;
    &:hover {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 6px;
      background-color: #d2d2d2;
      border-color: #d2d2d2;
      color: #0f172a;
    }
  }
  @media (max-width: 757.98px) {
    .button__Secondary {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 6px;
      background-color: #0f172a;
      border-color: #0f172a;
      color: #ffffff;
      &:hover {
        font-family: Poppins;
        font-size: 14px;
        line-height: 1.4;
        letter-spacing: 0;
        text-transform: none;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-left: 20px;
        padding-right: 20px;
        border-width: 1px;
        border-radius: 6px;
        background-color: #d2d2d2;
        border-color: #d2d2d2;
        color: #0f172a;
      }
    }
  }
}
.thema-test-petrit {
  --clr-primary-1000: #4499f2;
  --clr-primary-1000-rgb: 68,153,242;
  --clr-secondary-1000: #0f172a;
  --clr-secondary-1000-rgb: 15,23,42;
  --clr-accent-1000: #ff6b6b;
  --clr-accent-1000-rgb: 255,107,107;
  --clr-extra-4-1000: #8f4242;
  --clr-extra-4-1000-rgb: 143,66,66;
  --clr-extra-5-1000: #df5353;
  --clr-extra-5-1000-rgb: 223,83,83;
  --clr-extra-6-1000: #1e3a57;
  --clr-extra-6-1000-rgb: 30,58,87;
}
.thema-test-petrit {
  .h1, h1 {
    font-family: Lato;
    font-size: 32px;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 700;
  }
  @media (max-width: 757.98px) {
    .h1, h1 {
      font-family: Lato;
      font-size: 32px;
      line-height: 1.25;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 700;
    }
  }
  .h2, h2 {
    font-family: Lato;
    font-size: 26px;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 700;
  }
  @media (max-width: 757.98px) {
    .h2, h2 {
      font-family: Lato;
      font-size: 26px;
      line-height: 1.25;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 700;
    }
  }
  .h3, h3 {
    font-family: Lato;
    font-size: 22px;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h3, h3 {
      font-family: Lato;
      font-size: 22px;
      line-height: 1.3;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h4, h4 {
    font-family: Lato;
    font-size: 18px;
    line-height: 1.35;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h4, h4 {
      font-family: Lato;
      font-size: 18px;
      line-height: 1.35;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h5, h5 {
    font-family: Lato;
    font-size: 16px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h5, h5 {
      font-family: Lato;
      font-size: 16px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h6, h6 {
    font-family: Lato;
    font-size: 14px;
    line-height: 1.45;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h6, h6 {
      font-family: Lato;
      font-size: 14px;
      line-height: 1.45;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .paragraph, paragraph {
    font-family: Roboto;
    font-size: 15px;
    line-height: 1.6;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 400;
  }
  @media (max-width: 757.98px) {
    .paragraph, paragraph {
      font-family: Roboto;
      font-size: 15px;
      line-height: 1.6;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 400;
    }
  }
}
.thema-test-petrit .Button {
  .button__Primary {
    font-family: Roboto;
    font-size: 14px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 20px;
    padding-right: 20px;
    border-width: 1px;
    border-radius: 0;
    background-color: #4499f2;
    border-color: #4499f2;
    color: #ffffff;
    &:hover {
      font-family: Roboto;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 0;
      background-color: #d2d2d2;
      border-color: #d2d2d2;
      color: #0f172a;
    }
  }
  @media (max-width: 757.98px) {
    .button__Primary {
      font-family: Roboto;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 0;
      background-color: #4499f2;
      border-color: #4499f2;
      color: #ffffff;
      &:hover {
        font-family: Roboto;
        font-size: 14px;
        line-height: 1.4;
        letter-spacing: 0;
        text-transform: none;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-left: 20px;
        padding-right: 20px;
        border-width: 1px;
        border-radius: 0;
        background-color: #d2d2d2;
        border-color: #d2d2d2;
        color: #0f172a;
      }
    }
  }
  .button__Secondary {
    font-family: Roboto;
    font-size: 14px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 20px;
    padding-right: 20px;
    border-width: 1px;
    border-radius: 0;
    background-color: #0f172a;
    border-color: #0f172a;
    color: #ffffff;
    &:hover {
      font-family: Roboto;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 0;
      background-color: #d2d2d2;
      border-color: #d2d2d2;
      color: #0f172a;
    }
  }
  @media (max-width: 757.98px) {
    .button__Secondary {
      font-family: Roboto;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 0;
      background-color: #0f172a;
      border-color: #0f172a;
      color: #ffffff;
      &:hover {
        font-family: Roboto;
        font-size: 14px;
        line-height: 1.4;
        letter-spacing: 0;
        text-transform: none;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-left: 20px;
        padding-right: 20px;
        border-width: 1px;
        border-radius: 0;
        background-color: #d2d2d2;
        border-color: #d2d2d2;
        color: #0f172a;
      }
    }
  }
}
.loetjetheme {
  --clr-primary-1000: #4499f1;
  --clr-primary-1000-rgb: 68,153,241;
  --clr-secondary-1000: #0f172B;
  --clr-secondary-1000-rgb: 15,23,43;
  --clr-accent-1000: #ff6b6C;
  --clr-accent-1000-rgb: 255,107,108;
  --clr-grey-1000: #888888;
  --clr-grey-1000-rgb: 136,136,136;
}
.loetjetheme {
  .h1, h1 {
    font-family: Work Sans;
    font-size: 32px;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 700;
  }
  @media (max-width: 757.98px) {
    .h1, h1 {
      font-family: Work Sans;
      font-size: 32px;
      line-height: 1.25;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 700;
    }
  }
  .h2, h2 {
    font-family: Work Sans;
    font-size: 26px;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 700;
  }
  @media (max-width: 757.98px) {
    .h2, h2 {
      font-family: Work Sans;
      font-size: 26px;
      line-height: 1.25;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 700;
    }
  }
  .h3, h3 {
    font-family: Work Sans;
    font-size: 22px;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h3, h3 {
      font-family: Work Sans;
      font-size: 22px;
      line-height: 1.3;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h4, h4 {
    font-family: Work Sans;
    font-size: 18px;
    line-height: 1.35;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h4, h4 {
      font-family: Work Sans;
      font-size: 18px;
      line-height: 1.35;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h5, h5 {
    font-family: Work Sans;
    font-size: 16px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h5, h5 {
      font-family: Work Sans;
      font-size: 16px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h6, h6 {
    font-family: Work Sans;
    font-size: 14px;
    line-height: 1.45;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h6, h6 {
      font-family: Work Sans;
      font-size: 14px;
      line-height: 1.45;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .paragraph, paragraph {
    font-family: Poppins;
    font-size: 15px;
    line-height: 1.6;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 400;
  }
  @media (max-width: 757.98px) {
    .paragraph, paragraph {
      font-family: Poppins;
      font-size: 15px;
      line-height: 1.6;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 400;
    }
  }
}
.loetjetheme .Button {
  .button__Primary {
    font-family: Poppins;
    font-size: 14px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 20px;
    padding-right: 20px;
    border-width: 1px;
    border-radius: 30px;
    background-color: #4499f1;
    border-color: #4499f1;
    color: #ffffff;
    &:hover {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #d2d2d2;
      border-color: #d2d2d2;
      color: #0f172a;
    }
  }
  @media (max-width: 757.98px) {
    .button__Primary {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #4499f1;
      border-color: #4499f1;
      color: #ffffff;
      &:hover {
        font-family: Poppins;
        font-size: 14px;
        line-height: 1.4;
        letter-spacing: 0;
        text-transform: none;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-left: 20px;
        padding-right: 20px;
        border-width: 1px;
        border-radius: 30px;
        background-color: #d2d2d2;
        border-color: #d2d2d2;
        color: #0f172a;
      }
    }
  }
  .button__Secondary {
    font-family: Poppins;
    font-size: 14px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 20px;
    padding-right: 20px;
    border-width: 1px;
    border-radius: 30px;
    background-color: #0f172B;
    border-color: #0f172B;
    color: #ffffff;
    &:hover {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #d2d2d2;
      border-color: #d2d2d2;
      color: #0f172a;
    }
  }
  @media (max-width: 757.98px) {
    .button__Secondary {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #0f172B;
      border-color: #0f172B;
      color: #ffffff;
      &:hover {
        font-family: Poppins;
        font-size: 14px;
        line-height: 1.4;
        letter-spacing: 0;
        text-transform: none;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-left: 20px;
        padding-right: 20px;
        border-width: 1px;
        border-radius: 30px;
        background-color: #d2d2d2;
        border-color: #d2d2d2;
        color: #0f172a;
      }
    }
  }
}
.peter {
  --clr-primary-1000: #4499f2;
  --clr-primary-1000-rgb: 68,153,242;
  --clr-secondary-1000: #0f172a;
  --clr-secondary-1000-rgb: 15,23,42;
  --clr-accent-1000: #ff6b6b;
  --clr-accent-1000-rgb: 255,107,107;
  --clr-grey-1000: #888888;
  --clr-grey-1000-rgb: 136,136,136;
}
.peter {
  .h1, h1 {
    font-family: Poppins;
    font-size: 32px;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 700;
  }
  @media (max-width: 757.98px) {
    .h1, h1 {
      font-family: Poppins;
      font-size: 32px;
      line-height: 1.25;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 700;
    }
  }
  .h2, h2 {
    font-family: Poppins;
    font-size: 26px;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 700;
  }
  @media (max-width: 757.98px) {
    .h2, h2 {
      font-family: Poppins;
      font-size: 26px;
      line-height: 1.25;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 700;
    }
  }
  .h3, h3 {
    font-family: Poppins;
    font-size: 22px;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h3, h3 {
      font-family: Poppins;
      font-size: 22px;
      line-height: 1.3;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h4, h4 {
    font-family: Poppins;
    font-size: 18px;
    line-height: 1.35;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h4, h4 {
      font-family: Poppins;
      font-size: 18px;
      line-height: 1.35;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h5, h5 {
    font-family: Poppins;
    font-size: 16px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h5, h5 {
      font-family: Poppins;
      font-size: 16px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .h6, h6 {
    font-family: Poppins;
    font-size: 14px;
    line-height: 1.45;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 600;
  }
  @media (max-width: 757.98px) {
    .h6, h6 {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.45;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 600;
    }
  }
  .paragraph, paragraph {
    font-family: Poppins;
    font-size: 15px;
    line-height: 1.6;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 400;
  }
  @media (max-width: 757.98px) {
    .paragraph, paragraph {
      font-family: Poppins;
      font-size: 15px;
      line-height: 1.6;
      letter-spacing: 0;
      text-transform: none;
      font-weight: 400;
    }
  }
}
.peter .Button {
  .button__Primary {
    font-family: Poppins;
    font-size: 14px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 20px;
    padding-right: 20px;
    border-width: 1px;
    border-radius: 30px;
    background-color: #4499f2;
    border-color: #4499f2;
    color: #ffffff;
    &:hover {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #d2d2d2;
      border-color: #d2d2d2;
      color: #0f172a;
    }
  }
  @media (max-width: 757.98px) {
    .button__Primary {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #4499f2;
      border-color: #4499f2;
      color: #ffffff;
      &:hover {
        font-family: Poppins;
        font-size: 14px;
        line-height: 1.4;
        letter-spacing: 0;
        text-transform: none;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-left: 20px;
        padding-right: 20px;
        border-width: 1px;
        border-radius: 30px;
        background-color: #d2d2d2;
        border-color: #d2d2d2;
        color: #0f172a;
      }
    }
  }
  .button__Secondary {
    font-family: Poppins;
    font-size: 14px;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 20px;
    padding-right: 20px;
    border-width: 1px;
    border-radius: 30px;
    background-color: #0f172a;
    border-color: #0f172a;
    color: #ffffff;
    &:hover {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #d2d2d2;
      border-color: #d2d2d2;
      color: #0f172a;
    }
  }
  @media (max-width: 757.98px) {
    .button__Secondary {
      font-family: Poppins;
      font-size: 14px;
      line-height: 1.4;
      letter-spacing: 0;
      text-transform: none;
      padding-top: 12px;
      padding-bottom: 12px;
      padding-left: 20px;
      padding-right: 20px;
      border-width: 1px;
      border-radius: 30px;
      background-color: #0f172a;
      border-color: #0f172a;
      color: #ffffff;
      &:hover {
        font-family: Poppins;
        font-size: 14px;
        line-height: 1.4;
        letter-spacing: 0;
        text-transform: none;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-left: 20px;
        padding-right: 20px;
        border-width: 1px;
        border-radius: 30px;
        background-color: #d2d2d2;
        border-color: #d2d2d2;
        color: #0f172a;
      }
    }
  }
}
.deplo_default {
  --bg-color: #FFFFFF;
  --bg-color-rgb: 255,255,255;
  --button-padding: 0.5rem2rem;
  --button-padding-rgb: ;
  --button-radius: 0.2rem;
  --button-radius-rgb: ;
  --font-content: Default-Regular;
  --font-content-rgb: ;
  --font-heading: Default-Light;
  --font-heading-rgb: ;
  --font-link: Default;
  --font-link-rgb: ;
  --font-size: 1rem;
  --font-size-rgb: ;
  --input-line-height: 2rem;
  --input-line-height-rgb: ;
  --input-radius: 0.2rem;
  --input-radius-rgb: ;
  --negative-color: #FF3131;
  --negative-color-rgb: 255,49,49;
  --neutral-1: #FFFFFF;
  --neutral-1-rgb: 255,255,255;
  --neutral-2: #FAFAF9;
  --neutral-2-rgb: 250,250,249;
  --neutral-3: #E9E9EB;
  --neutral-3-rgb: 233,233,235;
  --neutral-4: #E0E0E0;
  --neutral-4-rgb: 224,224,224;
  --neutral-5: #BCBCBB;
  --neutral-5-rgb: 188,188,187;
  --neutral-6: #70706F;
  --neutral-6-rgb: 112,112,111;
  --neutral-7: #2C2C2C;
  --neutral-7-rgb: 44,44,44;
  --neutral-8: #000000;
  --neutral-8-rgb: 0,0,0;
  --neutral-transparent: transparent;
  --neutral-transparent-rgb: ;
  --positive-color: #32C77C;
  --positive-color-rgb: 50,199,124;
  --primary-1: #7853f8;
  --primary-1-rgb: 120,83,248;
  --primary-1-dark: #441072;
  --primary-1-dark-rgb: 68,16,114;
  --primary-1-light: #bea6d2;
  --primary-1-light-rgb: 190,166,210;
  --primary-2: #f2335e;
  --primary-2-rgb: 242,51,94;
  --primary-2-dark: #c72a3d;
  --primary-2-dark-rgb: 199,42,61;
  --primary-2-light: #f9b6b0;
  --primary-2-light-rgb: 249,182,176;
  --primary-3: #324cc7;
  --primary-3-rgb: 50,76,199;
  --primary-3-dark: #1c203b;
  --primary-3-dark-rgb: 28,32,59;
  --primary-3-light: #ced1f0;
  --primary-3-light-rgb: 206,209,240;
  --primary-4: #f4bc06;
  --primary-4-rgb: 244,188,6;
  --primary-4-dark: #fe8400;
  --primary-4-dark-rgb: 254,132,0;
  --primary-4-light: #fcf5de;
  --primary-4-light-rgb: 252,245,222;
  --secondary-1: #728398;
  --secondary-1-rgb: 114,131,152;
  --secondary-1-dark: #354B66;
  --secondary-1-dark-rgb: 53,75,102;
  --secondary-1-light: #D3D9E1;
  --secondary-1-light-rgb: 211,217,225;
  --secondary-2: #9FADBD;
  --secondary-2-rgb: 159,173,189;
  --secondary-2-dark: #08213F;
  --secondary-2-dark-rgb: 8,33,63;
  --secondary-2-light: #ECF0F4;
  --secondary-2-light-rgb: 236,240,244;
  --secondary-3-light: #F7F9FA;
  --secondary-3-light-rgb: 247,249,250;
  --warning-color: #FEC84C;
  --warning-color-rgb: 254,200,76;
}
.deplo_default .h2, .deplo_default h2, default .h2, default h2 {
  font-family: Default-Light;
  text-transform: none;
  text-size: 10px;
  font-size: 42px;
  line-height: 44px;
}
.deplo_default .h1, .deplo_default h1, default .h1, default h1 {
  font-family: Default-Bold;
  text-transform: none;
  font-size: 48px;
  line-height: 60px;
}
.deplo_default .h3, .deplo_default h3, default .h3, default h3 {
  font-family: Default-Bold;
  text-transform: none;
  font-size: 32px;
  line-height: 40px;
}
.deplo_default .h4, .deplo_default h4, default .h4, default h4 {
  font-family: Default-Bold;
  text-transform: none;
  font-size: 24px;
  line-height: 28px;
}
.deplo_default .h5, .deplo_default h5, default .h5, default h5 {
  font-family: Default-Bold;
  text-transform: none;
  font-size: 18px;
  line-height: 22px;
}
.deplo_default .p, .deplo_default p, default .p, default p {
  font-family: Default-Regular;
  text-transform: none;
  font-size: 18px;
  line-height: 26px;
}
.deplo_default .Button .button__Primary {
  background-color: var(--primary-1);
  color: var(--neutral-1);
  font-family: Default-Regular;
  font-size: 18px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  border-width: 0px;
  border-radius: 5px;
}
.deplo_default .Button .button__Primary:hover {
  background-color: var(--primary-1-dark);
  border-color: var(--neutral-transparent);
  color: var(--neutral-1);
  text-transform: none;
  font-family: Default-Regular;
  font-size: 18px;
  border-radius: 5px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  border-width: 0px;
}
.deplo_default .Button .button__Secondary {
  background-color: var(--negative-color);
  color: var(--neutral-1);
  font-family: Default-Regular;
  border-width: 0px;
  border-radius: 5px;
  font-size: 18px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.deplo_default .Button .button__Secondary:hover {
  background-color: var(--primary-2-dark);
  border-color: var(--neutral-transparent);
  color: var(--neutral-1);
  font-family: Default-Regular;
  font-size: 18px;
  border-width: 0px;
  border-radius: 5px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.deplo_default .Button .button__Tertiary {
  background-color: var(--primary-3);
  border-color: var(--neutral-transparent);
  color: var(--neutral-1);
  font-family: Default-Regular;
  font-size: 18px;
  border-width: 0px;
  border-radius: 5px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.deplo_default .Button .button__Tertiary:hover {
  background-color: var(--primary-3-dark);
  border-color: var(--neutral-transparent);
  color: var(--neutral-1);
  font-family: Default-Regular;
  font-size: 18px;
  border-width: 0px;
  border-radius: 5px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.deplo_default .Button .button__Ghost {
  background-color: var(--neutral-transparent);
  border-color: var(--neutral-1);
  color: var(--neutral-1);
  border-width: 1px;
  border-radius: 5px;
  font-size: 18px;
  font-family: Default-Regular;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.deplo_default .Button .button__CTA_button {
  background-color: var(--primary--color-4);
  color: var(--secondary-color-1000);
  border-width: 0px;
  border-radius: 5px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  font-size: 18px;
  font-family: Default-Regular;
}
.deplo_default .Button .button__CTA_button:hover {
  background-color: var(--secondary-color-200);
  font-family: Default-Regular;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.deplo_default .Button .button__Form__Next {
  background-color: var(--primary-1);
  color: var(--neutral-1);
  font-size: 16px;
  border-width: 0px;
  border-radius: 5px;
  font-family: Default-Regular;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.deplo_default .Button .button__Form__Next:hover {
  background-color: var(--primary--color-light-1);
}
.deplo_default .Button .button__Ghost_Primary {
  background-color: var(--neutral--color-Transparent);
  border-color: var(--primary--color-1);
  color: var(--primary--color-1);
  border-width: 2px;
  border-radius: 5px;
  font-size: 18px;
  font-family: Default-Regular;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.deplo_default .Button .button__Outline {
  background-color: var(--neutral--color-Transparent);
  border-color: var(--neutral-color-1000);
  color: var(--neutral-color-1000);
  border-width: 1px;
  border-radius: 5px;
  font-size: 18px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  font-family: Default-Regular;
}
.deplo_default .Button .button__PrimaryXL {
  background-color: var(--primary-1);
  color: var(--neutral-1);
  border-width: 0px;
  border-radius: 5px;
  font-family: Default-Regular;
  font-size: 24px;
  padding-top: 16px;
  padding-right: 32px;
  padding-bottom: 16px;
  padding-left: 32px;
}
.deplo_default .DeployMaster .truncate6 a, .deplo_default .DeployMaster .truncate6 div {
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
}
.deplo_default .DeployMaster .truncate6 span {
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
}
.deplo_default .DeployMaster .truncate2 a {
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
}
.deplo_default .DeployMaster .truncate2 span {
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
}
.deplo_default .DeployMaster .truncate4 a {
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
}
.deplo_default .DeployMaster .truncate4 span {
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
}
.deplo_default .hide-default-link a {
  text-decoration: none;
}
.deplo_default .middle-bar {
  width: 100vw;
  background-color: var(--bg-color);
  padding: 1.5rem 0rem;
}
.deplo_default .middle-bar .floating-content {
  transform: translateX(-53%) !important;
}
.deplo_default .middle-bar .floating-content .DescriptionLink .border-right {
  max-width: 244px;
}
.deplo_default .middle-bar-inner {
  display: inline-flex;
  height: 35px;
  width: 100%;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .deplo_default .middle-bar-inner {
    justify-content: space-between;
  }
}
.deplo_default .middle-bar .logo img {
  height: 50px;
  /* Responsive layout - when the screen is <576px wide */
}
.deplo_default .middle-bar .searching {
  cursor: wait;
}
.deplo_default .middle-bar .search-section {
  position: relative;
  display: none !important;
}
@media (min-width: 992px) {
  .deplo_default .middle-bar .search-section {
    display: block !important;
  }
}
.deplo_default .middle-bar .search-section .search-field {
  position: relative;
  border-radius: var(--input-radius);
  border: none;
  width: 400px;
  padding: 0.5rem 1rem;
}
.deplo_default .middle-bar .search-section i {
  font-size: 1.4rem;
  position: absolute;
  top: 8px;
  right: 10px;
  color: var(--darkblue-color);
}
.deplo_default .middle-bar .search-section .search-results {
  position: absolute;
  max-height: 250px;
  overflow-y: auto;
  border-width: 1px;
  border-color: var(--black-color);
  background-color: var(--white-color);
  min-width: 100%;
  width: max-content;
  z-index: 50;
}
.deplo_default .middle-bar .search-section .search-results button {
  padding: 2px 16px;
  position: relative;
  display: block;
  min-width: 100%;
  border: none;
  background-color: var(--white-color);
  text-align: left;
}
.deplo_default .top-bar {
  background-color: var(--grey-color);
  padding: 0.25rem;
  color: var(--black-color);
  font-size: var(--font-size);
}
.deplo_default .top-bar .top-bar[_ngcontent-lkq-c41] {
  height: 50px;
}
.deplo_default .top-bar .top-bar-inner {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  align-self: center;
  /* Responsive layout - when the screen is <576px wide */
}
@media (max-width: 575.98px) {
  .deplo_default .top-bar .top-bar-inner {
    flex-direction: column;
  }
}
.deplo_default .top-bar .top-bar-inner span {
  font-size: 14px;
}
.deplo_default .top-bar .links ul {
  margin-bottom: 0 !important;
  list-style-type: none !important;
  /* Responsive layout - when the screen is <576px wide */
}
@media (max-width: 575.98px) {
  .deplo_default .top-bar .links ul {
    padding-left: 0px;
  }
}
.deplo_default .top-bar .links ul li {
  list-style-type: none !important;
  display: inline;
  padding: 0 0.5em;
}
.deplo_default .top-bar .links ul li a {
  text-transform: none !important;
  font-weight: 500 !important;
  font-family: var(--font-content) !important;
  color: var(--white-color) !important;
  font-size: 14px !important;
}
.deplo_default .top-bar .links ul li a:hover {
  text-decoration: underline !important;
}
.deplo_default .top-bar .user-info-section {
  font-size: 14px !important;
}
.deplo_default .top-bar .user-info-section img {
  height: 20px;
}
.deplo_default .top-bar .user-info-section li {
  list-style-type: none;
}
.deplo_default .top-bar .user-info-section a {
  text-transform: none !important;
  font-weight: 500 !important;
  font-family: var(--font-content) !important;
  margin-left: 10px;
  font-size: 14px !important;
  /* Responsive layout - when the screen is <576px wide */
}
@media (max-width: 575.98px) {
  .deplo_default .top-bar .user-info-section a {
    margin: auto;
    text-align: center;
    display: block;
  }
}
.deplo_default .top-bar .user-info-section a:hover {
  color: #6CA7ED !important;
  text-decoration: underline !important;
}

@media (max-width: 757.98px) {
  .deplo_default .top-bar .navbar .navbar-nav {
    flex-direction: row;
  }
}
.deplo_default .center-container-column {
  display: flex;
  justify-content: center;
}
.deplo_default .DeployMaster .truncate6 a, .deplo_default .DeployMaster .truncate6 div {
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
}
.deplo_default .DeployMaster .truncate6 span {
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
}
.deplo_default .half-half-centered-multi-column .col-md-6 {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.deplo_default .DeployMaster .carousel-min-height .page-menu {
  min-height: 400px !important;
}
.deplo_default li {
  font-family: Default-Bold;
  padding-top: 10px;
  /* stel ruimte tussen filter blokken in */
  background-color: transparent;
  /* hier stel je achtergrondkleur in */
}
.deplo_default li > ul > li {
  line-height: 25px;
  /* hoogte tussen de keuzeopties */
  font-family: Default-Regular;
  background-color: transparent;
  /* evt. herhalen voor nested items */
}
.deplo_default li > ul > li input {
  margin-right: 15px !important;
  /* afstand tussen aanvinkblokje en tekst */
}
.deplo_default p.typing {
  display: block !important;
  text-align: center;
  overflow-y: visible;
}
.deplo_default .Cases-container h2 {
  margin-bottom: 30px;
}
.deplo_default .case-description {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.deplo_default .card:hover {
  opacity: 1;
}
.deplo_default .case {
  cursor: pointer;
  transition: transform 0.3s ease;
}
.deplo_default .case:hover {
  transform: translateY(-5px);
}
.deplo_default .case-title {
  font-size: 2rem;
  font-weight: bold;
  color: #000;
  position: relative;
  display: inline-block;
  background: linear-gradient(to right, #36B0A5 50%, #000 50%);
  background-size: 200% 100%;
  background-position: right bottom;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: background-position 0.8s ease;
}
.deplo_default .case:hover .case-title {
  background-position: left bottom;
}
.deplo_default .case-return {
  width: fit-content;
  padding: 4px 6px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  flex-direction: row;
  gap: 16px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.deplo_default .case-return:hover {
  background-color: #F5F5F5;
}
.deplo_default .case-return::before {
  content: "";
  display: inline-block;
  width: 16px;
  /* adjust to your icon size */
  height: 16px;
  background: url("/_static/Uploads/arrow-left.png") no-repeat center;
  background-size: contain;
  transform: rotate(0deg);
  transition: transform 0.2s ease-in-out;
}
.deplo_default .case-return:hover::before {
  transform: rotate(45deg);
}
.deplo_default .results-container {
  display: block;
  border-right: 1px solid #0D2C29;
  padding: 0 16px;
}
.deplo_default .results-container p {
  display: flex;
  align-items: center;
  gap: 8px;
}
.deplo_default .results-container-last {
  display: block;
  padding: 0 16px;
}
.deplo_default .results-container-last p {
  display: flex;
  align-items: center;
  gap: 8px;
}
.deplo_default .results-main .row {
  display: flex;
  flex-direction: row;
  align-content: center;
  align-items: center;
}
.deplo_default .results-container-mobile {
  display: block;
  border-bottom: 1px solid #0D2C29;
  padding: 16px 0;
}
.deplo_default .Cases-container h2 {
  margin-bottom: 30px;
}
.deplo_default .case-description {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.deplo_default .card:hover {
  opacity: 1;
}
.deplo_default .case {
  cursor: pointer;
  transition: transform 0.3s ease;
}
.deplo_default .case:hover {
  transform: translateY(-5px);
}
.deplo_default .case-title {
  font-size: 2rem;
  font-weight: bold;
  color: #000;
  position: relative;
  display: inline-block;
  background: linear-gradient(to right, #36B0A5 50%, #000 50%);
  background-size: 200% 100%;
  background-position: right bottom;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: background-position 0.8s ease;
}
.deplo_default .case:hover .case-title {
  background-position: left bottom;
}
.deplo_default .case-return {
  width: fit-content;
  padding: 4px 6px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  flex-direction: row;
  gap: 16px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.deplo_default .case-return:hover {
  background-color: #F5F5F5;
}
.deplo_default .case-return::before {
  content: "";
  display: inline-block;
  width: 16px;
  /* adjust to your icon size */
  height: 16px;
  background: url("/_static/Uploads/arrow-left.png") no-repeat center;
  background-size: contain;
  transform: rotate(0deg);
  transition: transform 0.2s ease-in-out;
}
.deplo_default .case-return:hover::before {
  transform: rotate(45deg);
}
.deplo_default .results-container {
  display: block;
  border-right: 1px solid #0D2C29;
  padding: 0 16px;
}
.deplo_default .results-container p {
  display: flex;
  align-items: center;
  gap: 8px;
}
.deplo_default .results-container-last {
  display: block;
  padding: 0 16px;
}
.deplo_default .results-container-last p {
  display: flex;
  align-items: center;
  gap: 8px;
}
.deplo_default .results-main .row {
  display: flex;
  flex-direction: row;
  align-content: center;
  align-items: center;
}
.deplo_default .results-container-mobile {
  display: block;
  border-bottom: 1px solid #0D2C29;
  padding: 16px 0;
}
.deplo_default .DeployMaster .default-table table {
  width: 100%;
  border: 0px solid #ffffff;
}
.deplo_default .DeployMaster .default-table td, .deplo_default .DeployMaster .default-table th {
  padding: 10px;
  border: 0px solid #ffffff;
}
.deplo_default .DeployMaster .default-table th {
  background-color: #ffffff;
  color: #000000;
  text-align: left;
}
.deplo_default .DeployMaster .default-table tbody {
  border-bottom: 1px solid #F6F7F9;
}
.deplo_default .DeployMaster .default-table tbody tr:hover {
  background-color: #F3F9FE !important;
}
.deplo_default .DeployMaster .default-table tbody tr:nth-of-type(odd) {
  background-color: #F6F7F9;
}
.deplo_default .DeployMaster .default-table tbody tr:last-of-type {
  border-bottom: 2px solid #F6F7F9;
}
@charset "UTF-8";
.deplo_default .navbar {
  padding: 0 !important;
}
.deplo_default .navbar .nav-item {
  padding: 0 1rem;
}
.deplo_default .navbar .navbar-nav .nav-link {
  color: var(--black-color);
  cursor: pointer;
  font-family: Gilroy-Bold !important;
}
.deplo_default .navbar .navbar-nav .nav-link:hover {
  color: var(--primary-color-1200) !important;
}
.deplo_default .navbar .nav-link.active,
.deplo_default .navbar .nav-link.active-parent,
.deplo_default .navbar .show > .nav-link {
  color: var(--primary-color-1200);
  border-bottom: 1px solid var(--primary-color-1200);
}
.deplo_default .navbar .navbar-collapse {
  justify-content: center;
}
.deplo_default .navbar .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8, %3Csvg viewBox=’0 0 32 32′ xmlns=’http://www.w3.org/2000/svg’%3E%3Cpath stroke=’rgba(0, 0, 0, 0.5)’ stroke-width=’2′ stroke-linecap=’round’ stroke-miterlimit=’10’ d=’M4 8h24M4 16h24M4 24h24’/%3E%3C/svg%3E");
  width: 2.5em;
  height: 2em;
}
.deplo_default .navbar .navbar-toggler i {
  color: var(#021e3f);
  font-size: 2.1rem;
}
.deplo_default .navbar .navbar-toggler:focus {
  box-shadow: 0 0 0 0rem !important;
}
@charset "UTF-8";
.deplo_default {
  /* Container: <ul id="accordion" class="accordion"> */
  /* wrappers die onder UL zitten (ongeldige HTML, maar we stylen eromheen) */
  /* Items: geen eigen background meer, anders krijg je repen */
  /* Links */
}
.deplo_default ul.accordion {
  /* reset + layout */
  list-style: none !important;
  margin: 0 !important;
  /* ✅ ruimte vóór eerste & na laatste item */
  padding: 30px 20px !important;
  /* ✅ spacing tussen items exact 10px */
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  width: 100%;
  font-family: "Poppins";
  /* ✅ background op de hele container → vult ook de "gaten" */
  background-color: rgba(38, 38, 38, 0.9) !important;
  background-color: #262626E6 !important;
  color: #ffffff !important;
  /* optioneel: rondingen als het mooier is */
  /* border-radius: 8px; */
}
@media (min-width: 992px) {
  .deplo_default ul.accordion {
    display: none;
  }
}
.deplo_default ul.accordion > div.ng-star-inserted {
  margin: 0 !important;
  padding: 0 !important;
}
.deplo_default ul.accordion > div.ng-star-inserted > li.main-menu {
  background: transparent !important;
  color: #ffffff !important;
  /* klikgebied + interne padding */
  padding: 12px 16px !important;
  margin: 0 !important;
  list-style: none !important;
}
.deplo_default ul.accordion > div.ng-star-inserted > li.main-menu > a.main-menu-item {
  color: #ffffff !important;
  text-decoration: none !important;
  display: block;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 1rem;
}
.360fe_TNV {
  --bg-color: #FFFFFF;
  --bg-color-rgb: 255,255,255;
  --button-padding: 0.5rem 2rem;
  --button-padding-rgb: ;
  --button-radius: 0.2rem;
  --button-radius-rgb: ;
  --font-content: Aeonik;
  --font-content-rgb: ;
  --font-heading: Gilroy;
  --font-heading-rgb: ;
  --font-link: Aeonik;
  --font-link-rgb: ;
  --font-size: 1rem;
  --font-size-rgb: ;
  --input-line-height: 3rem;
  --input-line-height-rgb: ;
  --input-radius: 0.2rem;
  --input-radius-rgb: ;
  --main-color: #f2f2f2;
  --main-color-rgb: 242,242,242;
  --negative-color: #FF3131;
  --negative-color-rgb: 255,49,49;
  --neutral--color-Transparant: transparent;
  --neutral--color-Transparant-rgb: ;
  --neutral-color-0: #FFFFFF;
  --neutral-color-0-rgb: 255,255,255;
  --neutral-color-100: #E9E9EB;
  --neutral-color-100-rgb: 233,233,235;
  --neutral-color-1000: #000000;
  --neutral-color-1000-rgb: 0,0,0;
  --neutral-color-200: #E0E0E0;
  --neutral-color-200-rgb: 224,224,224;
  --neutral-color-400: #BCBCBB;
  --neutral-color-400-rgb: 188,188,187;
  --neutral-color-50: #FAFAF9;
  --neutral-color-50-rgb: 250,250,249;
  --neutral-color-600: #808080;
  --neutral-color-600-rgb: 128,128,128;
  --neutral-color-800: #2C2C2C;
  --neutral-color-800-rgb: 44,44,44;
  --positive-color: #32C77C;
  --positive-color-rgb: 50,199,124;
  --primary--color-Grey: #fafafa;
  --primary--color-Grey-rgb: 250,250,250;
  --primary--color-White: #FFFFFF;
  --primary--color-White-rgb: 255,255,255;
  --secondary-color-100: #ECF0F4;
  --secondary-color-100-rgb: 236,240,244;
  --secondary-color-1000: #08213F;
  --secondary-color-1000-rgb: 8,33,63;
  --secondary-color-200: #D3D9E1;
  --secondary-color-200-rgb: 211,217,225;
  --secondary-color-400: #9FADBD;
  --secondary-color-400-rgb: 159,173,189;
  --secondary-color-50: #F7F9FA;
  --secondary-color-50-rgb: 247,249,250;
  --secondary-color-600: #728398;
  --secondary-color-600-rgb: 114,131,152;
  --secondary-color-800: #354B66;
  --secondary-color-800-rgb: 53,75,102;
  --warning-color: #FEC84C;
  --warning-color-rgb: 254,200,76;
  --primary-1-dark: #1a3878;
  --primary-1-dark-rgb: 26,56,120;
  --primary-1-light: #3eb6eb;
  --primary-1-light-rgb: ;
  --primary-2-dark: #ab6c02;
  --primary-2-dark-rgb: 171,108,2;
  --primary-2-light: #d29544;
  --primary-2-light-rgb: 210,149,68;
  --primary-3-dark: #267bbe;
  --primary-3-dark-rgb: 38,123,190;
  --primary-3-light: #ecf7fb;
  --primary-3-light-rgb: 236,247,251;
}
.Isam .h1, .Isam h1, Isam .h1, Isam h1 {
  font-family: Default-Bold;
  text-transform: none;
  font-size: 45px;
  line-height: 1.2;
}
.Isam .h2, .Isam h2, Isam .h2, Isam h2 {
  font-family: Default-Bold;
  text-transform: none;
  font-size: 30px;
  line-height: 1.2;
}
.Isam .h3, .Isam h3, Isam .h3, Isam h3 {
  font-family: Default-Bold;
  text-transform: none;
  font-size: 24px;
  line-height: 1.1;
}
.Isam .h4, .Isam h4, Isam .h4, Isam h4 {
  font-family: Default-Bold;
  text-transform: none;
  font-size: 20px;
  line-height: 1.1;
}
.Isam .h5, .Isam h5, Isam .h5, Isam h5 {
  font-family: Default-Bold;
  text-transform: none;
  font-size: 14px;
}
.360fe_TNV .Button .button__Primary {
  background-color: var(--bg-color);
  border-color: var(--primary-1-dark);
  color: var(--primary-1-dark);
  border-width: 1px;
  font-size: 16px;
  padding-top: 12px;
  padding-right: 20px;
  padding-bottom: 12px;
  padding-left: 20px;
  border-radius: 0px;
  font-family: Montserrat-Bold;
  text-transform: uppercase;
}
.360fe_TNV .Button .button__Primary:hover {
  background-color: var(--secondary-color-200);
  border-color: var(--primary-1-dark);
  color: var(--primary-1-dark);
  font-family: Montserrat-Bold;
}
.360fe_TNV .Button .button__Primary:active {
  background-color: var(--primary-1-dark);
  border-color: var(--primary-1-dark);
  color: var(--bg-color);
  font-family: Montserrat-Bold;
}
.360fe_TNV .Button .button__Secondary {
  background-color: var(--bg-color);
  border-color: var(--primary-2-dark);
  color: var(--primary-2-dark);
  border-width: 1px;
  border-radius: 0px;
  font-size: 16px;
  padding-top: 12px;
  padding-right: 20px;
  padding-bottom: 12px;
  padding-left: 20px;
  font-family: Montserrat-Bold;
  text-transform: uppercase;
}
.360fe_TNV .Button .button__Secondary:hover {
  background-color: var(--secondary-color-200);
  border-color: var(--primary-2-dark);
  color: var(--primary-2-dark);
  font-family: Montserrat-Bold;
  text-transform: uppercase;
}
.360fe_TNV .Button .button__Secondary:active {
  font-family: Montserrat-Bold;
}
.360fe_TNV .Button .button__Tertiary {
  background-color: var(--bg-color);
  border-color: var(--secondary-color-600);
  color: var(--secondary-color-600);
  border-width: 1px;
  border-radius: 0px;
  font-size: 16px;
  padding-top: 12px;
  padding-right: 20px;
  padding-bottom: 12px;
  padding-left: 20px;
  font-family: Montserrat-Bold;
  text-transform: uppercase;
}
.360fe_TNV .Button .button__Tertiary:hover {
  background-color: var(--neutral-color-400);
}
.360fe_TNV .Button .button__Text {
  background-color: var(--neutral--color-Transparant);
  color: var(--neutral-color-1000);
  font-family: Montserrat-Bold;
  font-size: 16px;
  padding-top: 12px;
  padding-right: 20px;
  padding-bottom: 12px;
  padding-left: 20px;
  border-width: 0px;
}
.360fe_TNV .Button .button__Text:hover {
  background-color: var(--neutral--color-Transparant);
  color: var(--primary-color-1200);
  font-family: Default-Regular;
  font-size: 16px;
  padding-top: 12px;
  padding-right: 20px;
  padding-left: 20px;
  padding-bottom: 12px;
  border-width: 0px;
}
.360fe_TNV .Button .button__Text:active {
  background-color: var(--neutral--color-Transparant);
  color: var(--primary-color-1200);
  border-width: 0px;
  font-family: Default-Regular;
  font-size: 16px;
  padding-top: 12px;
  padding-bottom: 12px;
  padding-right: 20px;
  padding-left: 20px;
}
.360fe_TNV .Button .button__Ghost {
  background-color: var(--neutral--color-Transparant);
  border-color: var(--primary-1-dark);
  color: var(--primary-1-dark);
  border-width: 1px;
  font-family: Montserrat-Bold;
  font-size: 16px;
  padding-top: 12px;
  padding-right: 20px;
  padding-bottom: 12px;
  padding-left: 20px;
  text-transform: none;
}
.360fe_TNV .Button .button__Ghost:hover {
  background-color: var(--neutral-color-200);
  border-width: 1px;
}
.360fe_TNV .Button .button__Form__Next {
  background-color: var(--bg-color);
  border-color: var(--primary-1-dark);
  color: var(--primary-1-dark);
  border-width: 1px;
  border-radius: 0px;
  font-size: 16px;
  padding-top: 12px;
  padding-right: 20px;
  padding-bottom: 12px;
  padding-left: 20px;
  font-family: Montserrat-Bold;
  text-transform: uppercase;
}
.360fe_TNV .Button .button__Form__Next:hover {
  background-color: var(--neutral-color-200);
}
.360fe_TNV .Button .button__Form__Prev {
  background-color: var(--bg-color);
  border-color: var(--secondary-color-600);
  color: var(--secondary-color-800);
  padding-top: 12px;
  padding-right: 20px;
  padding-bottom: 12px;
  padding-left: 20px;
  border-width: 1px;
  border-radius: 0px;
  font-family: Montserrat-Bold;
  font-size: 16px;
  text-transform: uppercase;
}
.360fe_TNV .Button .button__Form__Prev:hover {
  background-color: var(--neutral-color-200);
}
.360fe_TNV .Button .button__Subnav {
  background-color: var(--primary-2-light);
  border-color: var(--primary-2-light);
  color: var(--primary--color-White);
  font-family: Montserrat-Bold;
  text-transform: uppercase;
  font-size: 14px;
  border-width: 0px;
  border-radius: 0px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.360fe_TNV .Button .button__Subnav:hover {
  background-color: var(--neutral-color-200);
  border-color: var(--primary-1-dark);
  color: var(--primary-1-dark);
}
.360fe_TNV .Button .button__Subnav:active {
  background-color: var(--primary-1-dark);
}
.360fe_TNV .Button .button__SubnavSelect {
  background-color: var(--primary-1-dark);
  border-color: var(--bg-color);
  color: var(--bg-color);
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  border-width: 0px;
  border-radius: 0px;
  font-size: 14px;
  font-family: Montserrat-Bold;
  text-transform: uppercase;
}
.360fe_TNV .Button .button__SubnavSelect:hover {
  background-color: var(--neutral-color-200);
  border-color: var(--primary-1-dark);
  color: var(--primary-1-dark);
  font-family: Montserrat-Bold;
}
.360fe_TNV .Button .button__SubnavSelect:active {
  background-color: var(--primary-1-dark);
  font-family: Montserrat-Bold;
}
.360fe_TNV .Button .button__Text_small {
  background-color: var(--neutral--color-Transparant);
  font-family: Default-Regular;
  font-size: 14px;
  border-width: 0;
  padding-top: 8px;
  padding-right: 12px;
  padding-bottom: 8px;
  padding-left: 12px;
}
.360fe_TNV .Button .button__Text_small:hover {
  background-color: var(--neutral-color-100);
  border-radius: 8px;
  font-family: Default-Regular;
  font-size: 14px;
}
.360fe_TNV .Button .button__Wireframe {
  background-color: var(--neutral--color-Transparant);
  border-color: var(--primary-1-dark);
  color: var(--primary-1-dark);
  font-size: 16px;
  font-family: Montserrat-Bold;
  padding-top: 10px;
  padding-right: 30px;
  padding-bottom: 10px;
  padding-left: 30px;
  border-width: 1px;
  text-transform: uppercase;
}
.360fe_TNV .Button .button__Wireframe:hover {
  background-color: var(--secondary-color-50);
}
@charset "UTF-8";
.360fe_TNV {
  /* Berenschot 360° Feedback Scan — Rapport SCSS (v1)
  *
  * Gebaseerd op Sales Competency Scan CSS v2 (Bisbrick-safe), met opzet ÉÉN afwijking:
  *   1. Geen body {} selector (Bisbrick regelt eigen body)
  *   2. Geen universal selector (.bs-scan *)
  *   3. @media print {} bewust WEL aanwezig (zie onderaan dit bestand) — op verzoek, zodat
  *      alle print/page-break-regels op één plek staan i.p.v. verspreid over elke selector.
  *      LET OP: dit was in v1→v2 van de Sales Competency Scan-CSS juist verwijderd omdat het
  *      de Bisbrick scss→css-Function liet crashen. Als je dit bestand ongewijzigd door die
  *      Function haalt, is de kans groot dat dezelfde parserfout terugkomt. Test dat eerst
  *      met een kleine losse @media-blok voordat je het hele bestand erdoorheen haalt, of
  *      strip dit blok in een build-stap vlak vóór opslag in de DB als het toch faalt.
  *   4. Geen ::after met content-string (Berenschot-tekst via HTML-element)
  *   5. Overal spatie na colon: "color: #FFF" ipv "color:#FFF"
  *   6. Font-family zonder quotes voor single-word namen: Calibri, Arial, sans-serif
  *      (multi-word namen als "Segoe UI" hebben wel quotes nodig, dat is normale CSS-syntax,
  *      geen SCSS-interpolatie-risico)
  *
  * CSS-namespace .bs-scan360 (bewust anders dan .bs-scan, zodat beide rapporten los van
  * elkaar in dezelfde tenant-theme kunnen bestaan zonder class-collision).
  *
  * Basiskleuren (ongewijzigd t.o.v. Sales Competency Scan):
  *   Navy:  #1A3877  (Berenschot primair)
  *   Gold:  #C9A961  (accent, bevestigde sterktes)
  *   Text:  #1A2438
  *   Muted: #5C6478
  *   Light: #E8EDF4
  *
  * Nieuwe kleuren voor 360-specifieke duiding (NIET uit het Berenschot-merkboek gehaald —
  * ter kalibratie voorleggen, net als de maturiteits-labels zelf al "definitief te bevestigen"
  * zijn volgens het README-tabblad van de matrix):
  *   Blinde vlek (zelf hoger dan anderen):     #B2622E  (warme terracotta, geen alarmrood)
  *   Verborgen kracht (anderen hoger dan zelf): #3E8074  (gedempt groen/teal)
  *   Bevestigd / aligned:                       #5C6478  (zelfde als Muted, bewust neutraal)
  */
  /* --- Header --- */
  /* --- Body wrapper --- */
  /* --- Section --- */
  /* --- Sectie 1: Profiel --- */
  /* Dual bars: per competentie twee dunne tracks (zelf / anderen) i.p.v. één bar.
     Bewust GEEN overlappende/gestapelde bars in CSS-only — simpeler en stabieler
     in html-naar-pdf/jsreport rendering dan absolute-positioned overlays. */
  /* --- Archetype-vergelijking (zelf vs anderen), onderdeel van Sectie 1 --- */
  /* --- Sectie 2: Bevestigde kracht in actie --- */
  /* --- Sectie 3: Zelfinzicht (blinde vlekken / verborgen krachten) --- */
  /* --- Sectie 4: Groei-routes (4-cell, ongewijzigd van Sales Competency Scan) --- */
  /* --- Sectie 5: Learning path timeline (ongewijzigd) --- */
  /* --- Sectie 6: Verbreding (ongewijzigd) --- */
  /* --- Sectie 7: Maturiteits-context (spider + tabel) --- */
  /* --- Footer --- */
  /* --- Intro --- */
  /* --- Divider --- */
  /* --- Spider --- */
  /* --- Print / PDF page breaks ---
   * Zie waarschuwing bovenaan dit bestand: dit blok is bewust behouden op verzoek, maar was
   * de oorzaak van de SCSS-parserfout in de vorige versie van de Sales Competency Scan-CSS.
   */
}
.360fe_TNV .bs-scan360 {
  max-width: 900px;
  margin: 24px auto;
  background: #FFFFFF;
  color: #1A2438;
  font-family: Calibri, Arial, sans-serif;
}
.360fe_TNV .bs-scan360__header {
  background: #1A3877;
  color: #FFFFFF;
  padding: 32px 40px 24px;
  position: relative;
}
.360fe_TNV .bs-scan360__header-eyebrow {
  font-size: 11px;
  letter-spacing: 3px;
  font-weight: 700;
  color: #C9A961;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.360fe_TNV .bs-scan360__header-title {
  font-size: 26px;
  font-weight: 700;
  margin: 0 0 4px;
  color: #FFFFFF;
}
.360fe_TNV .bs-scan360__header-meta {
  font-size: 13px;
  color: #B8C5DD;
  margin-top: 10px;
}
.360fe_TNV .bs-scan360__header-brand {
  position: absolute;
  top: 32px;
  right: 40px;
  font-size: 14px;
  font-weight: 700;
  color: #FFFFFF;
  letter-spacing: 0.5px;
}
.360fe_TNV .bs-scan360__body {
  padding: 32px 40px 40px;
}
.360fe_TNV .bs-scan360__section {
  margin-bottom: 32px;
}
.360fe_TNV .bs-scan360__section-label {
  font-size: 10px;
  letter-spacing: 4px;
  color: #5C6478;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.360fe_TNV .bs-scan360__section-title {
  font-size: 22px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 4px;
}
.360fe_TNV .bs-scan360__section-lead {
  font-size: 13px;
  color: #5C6478;
  font-style: italic;
  margin: 0 0 20px;
}
.360fe_TNV .bs-scan360__profile {
  background: #1A3877;
  color: #FFFFFF;
  padding: 28px 32px;
  margin-top: 8px;
}
.360fe_TNV .bs-scan360__profile-narrative {
  font-size: 14px;
  color: #EAEDF4;
  line-height: 1.55;
  margin: 20px 0 0;
}
.360fe_TNV .bs-scan360__profile-narrative strong {
  color: #FFFFFF;
  font-weight: 700;
}
.360fe_TNV .bs-scan360__bars {
  margin-top: 24px;
}
.360fe_TNV .bs-scan360__bar-group {
  margin-bottom: 14px;
}
.360fe_TNV .bs-scan360__bar-comp-label {
  font-size: 11.5px;
  font-weight: 700;
  color: #D5DEEB;
  margin-bottom: 4px;
}
.360fe_TNV .bs-scan360__bar-comp-label--priority {
  color: #C9A961;
}
.360fe_TNV .bs-scan360__bar-line {
  display: flex;
  align-items: center;
  margin-bottom: 3px;
  font-size: 11px;
}
.360fe_TNV .bs-scan360__bar-tag {
  width: 62px;
  color: #B8C5DD;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.360fe_TNV .bs-scan360__bar-track {
  flex: 1;
  height: 8px;
  background: rgba(255, 255, 255, 0.15);
  position: relative;
}
.360fe_TNV .bs-scan360__bar-fill--self {
  height: 8px;
  background: #C9A961;
}
.360fe_TNV .bs-scan360__bar-fill--other {
  height: 8px;
  background: #5F7CA8;
}
.360fe_TNV .bs-scan360__bar-value {
  width: 38px;
  text-align: right;
  color: #D5DEEB;
  font-size: 11px;
  margin-left: 10px;
  font-weight: 600;
}
.360fe_TNV .bs-scan360__archetype-compare {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 16px 0;
  margin: 20px -16px 0;
}
.360fe_TNV .bs-scan360__archetype-chip {
  display: table-cell;
  width: 50%;
  background: rgba(255, 255, 255, 0.08);
  padding: 14px 16px;
  vertical-align: top;
}
.360fe_TNV .bs-scan360__archetype-chip-label {
  font-size: 10px;
  letter-spacing: 2px;
  color: #C9A961;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.360fe_TNV .bs-scan360__archetype-chip-value {
  font-size: 16px;
  font-weight: 700;
  color: #FFFFFF;
}
.360fe_TNV .bs-scan360__archetype-chip-pct {
  font-size: 12px;
  color: #B8C5DD;
  margin-top: 2px;
}
.360fe_TNV .bs-scan360__two-col {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 20px 0;
  margin-left: -20px;
  margin-right: -20px;
}
.360fe_TNV .bs-scan360__col {
  display: table-cell;
  width: 50%;
  vertical-align: top;
}
.360fe_TNV .bs-scan360__card {
  background: #F5F7FA;
  padding: 20px 22px;
  border-top: 3px solid #1A3877;
}
.360fe_TNV .bs-scan360__card--gold {
  border-top-color: #C9A961;
}
.360fe_TNV .bs-scan360__item {
  margin-bottom: 16px;
}
.360fe_TNV .bs-scan360__item:last-child {
  margin-bottom: 0;
}
.360fe_TNV .bs-scan360__item-title {
  font-size: 14px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 4px;
}
.360fe_TNV .bs-scan360__item-body {
  font-size: 12.5px;
  color: #1A2438;
  margin: 0;
  line-height: 1.5;
}
.360fe_TNV .bs-scan360__item-scores {
  font-size: 11px;
  color: #5C6478;
  margin: 4px 0 0;
}
.360fe_TNV .bs-scan360__item-scores strong {
  color: #1A3877;
}
.360fe_TNV .bs-scan360__action {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px dashed #D5DEEB;
  font-size: 12px;
  color: #1A3877;
}
.360fe_TNV .bs-scan360__action-label {
  font-weight: 700;
  color: #C9A961;
  letter-spacing: 2px;
  font-size: 10px;
  text-transform: uppercase;
  margin-right: 6px;
}
.360fe_TNV .bs-scan360__gap-list {
  margin-top: 8px;
}
.360fe_TNV .bs-scan360__gap-row {
  display: flex;
  align-items: flex-start;
  padding: 14px 0;
  border-bottom: 1px solid #E8EDF4;
}
.360fe_TNV .bs-scan360__gap-row:last-child {
  border-bottom: none;
}
.360fe_TNV .bs-scan360__gap-comp {
  width: 190px;
  font-size: 13px;
  font-weight: 700;
  color: #1A3877;
  padding-right: 12px;
}
.360fe_TNV .bs-scan360__gap-body {
  flex: 1;
}
.360fe_TNV .bs-scan360__gap-scores {
  font-size: 11px;
  color: #5C6478;
  margin-bottom: 4px;
}
.360fe_TNV .bs-scan360__gap-text {
  font-size: 12.5px;
  color: #1A2438;
  line-height: 1.5;
  margin: 0;
}
.360fe_TNV .bs-scan360__badge {
  display: inline-block;
  padding: 3px 10px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #FFFFFF;
  margin-right: 8px;
}
.360fe_TNV .bs-scan360__badge--blindspot {
  background: #B2622E;
}
.360fe_TNV .bs-scan360__badge--hidden {
  background: #3E8074;
}
.360fe_TNV .bs-scan360__badge--aligned {
  background: #5C6478;
}
.360fe_TNV .bs-scan360__growth {
  margin-bottom: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid #E8EDF4;
}
.360fe_TNV .bs-scan360__growth:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.360fe_TNV .bs-scan360__growth-title {
  font-size: 15px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 12px;
  display: flex;
  align-items: baseline;
}
.360fe_TNV .bs-scan360__growth-number {
  color: #C9A961;
  font-weight: 700;
  margin-right: 10px;
  font-size: 18px;
}
.360fe_TNV .bs-scan360__growth-module {
  font-size: 11px;
  color: #5C6478;
  font-weight: 500;
  font-style: italic;
  margin-left: auto;
  letter-spacing: 1px;
}
.360fe_TNV .bs-scan360__growth-tag {
  font-size: 10px;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-weight: 700;
  margin-left: 10px;
  padding: 2px 8px;
  color: #FFFFFF;
}
.360fe_TNV .bs-scan360__growth-grid {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 10px 0;
  margin-left: -10px;
  margin-right: -10px;
}
.360fe_TNV .bs-scan360__growth-cell {
  display: table-cell;
  width: 25%;
  vertical-align: top;
}
.360fe_TNV .bs-scan360__growth-cell-label {
  font-size: 9px;
  letter-spacing: 3px;
  color: #C9A961;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.360fe_TNV .bs-scan360__growth-cell-body {
  font-size: 12px;
  color: #1A2438;
  line-height: 1.45;
}
.360fe_TNV .bs-scan360__timeline {
  position: relative;
  padding-left: 22px;
}
.360fe_TNV .bs-scan360__timeline-line {
  position: absolute;
  left: 6px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: #1A3877;
}
.360fe_TNV .bs-scan360__timeline-item {
  position: relative;
  margin-bottom: 22px;
}
.360fe_TNV .bs-scan360__timeline-item:last-child {
  margin-bottom: 0;
}
.360fe_TNV .bs-scan360__timeline-marker {
  position: absolute;
  left: -22px;
  top: 4px;
  width: 14px;
  height: 14px;
  background: #1A3877;
  border-radius: 50%;
  border: 3px solid #FFFFFF;
  box-shadow: 0 0 0 2px #1A3877;
}
.360fe_TNV .bs-scan360__timeline-marker--gold {
  background: #C9A961;
  box-shadow: 0 0 0 2px #C9A961;
}
.360fe_TNV .bs-scan360__timeline-horizon {
  font-size: 10px;
  letter-spacing: 3px;
  font-weight: 700;
  color: #C9A961;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.360fe_TNV .bs-scan360__timeline-headline {
  font-size: 15px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 8px;
}
.360fe_TNV .bs-scan360__timeline-list {
  margin: 0;
  padding-left: 0;
  list-style: none;
}
.360fe_TNV .bs-scan360__timeline-list li {
  font-size: 12.5px;
  color: #1A2438;
  line-height: 1.5;
  padding-left: 14px;
  position: relative;
  margin-bottom: 4px;
}
.360fe_TNV .bs-scan360__timeline-list li strong {
  color: #1A3877;
}
.360fe_TNV .bs-scan360__timeline-arrow {
  color: #C9A961;
  font-weight: 700;
  margin-right: 6px;
}
.360fe_TNV .bs-scan360__verbreding {
  background: #FAF6ED;
  padding: 20px 24px;
  border-left: 3px solid #C9A961;
}
.360fe_TNV .bs-scan360__verbreding-label {
  font-size: 10px;
  letter-spacing: 3px;
  color: #C9A961;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.360fe_TNV .bs-scan360__verbreding-title {
  font-size: 15px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 6px;
}
.360fe_TNV .bs-scan360__verbreding-body {
  font-size: 13px;
  color: #1A2438;
  margin: 0;
  line-height: 1.5;
}
.360fe_TNV .bs-scan360__spider-wrap {
  text-align: center;
  margin: 16px 0 0;
}
.360fe_TNV .bs-scan360__spider-wrap img {
  max-width: 640px;
  width: 100%;
  height: auto;
}
.360fe_TNV .bs-scan360__spider-note {
  font-size: 11px;
  color: #5C6478;
  font-style: italic;
  margin-top: 8px;
}
.360fe_TNV .bs-scan360__scores-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 20px;
  font-size: 12px;
}
.360fe_TNV .bs-scan360__scores-table th {
  text-align: left;
  padding: 8px 10px;
  background: #F5F7FA;
  color: #5C6478;
  font-weight: 700;
  letter-spacing: 2px;
  font-size: 10px;
  text-transform: uppercase;
  border-bottom: 2px solid #E8EDF4;
}
.360fe_TNV .bs-scan360__scores-table td {
  padding: 8px 10px;
  border-bottom: 1px solid #E8EDF4;
  color: #1A2438;
}
.360fe_TNV .bs-scan360__scores-table td.bs-scan360__scores-comp {
  font-weight: 700;
  color: #1A3877;
}
.360fe_TNV .bs-scan360__scores-table td.bs-scan360__scores-bsm {
  color: #5C6478;
}
.360fe_TNV .bs-scan360__scores-table td.bs-scan360__scores-score {
  text-align: right;
  font-weight: 700;
  color: #1A3877;
}
.360fe_TNV .bs-scan360__scores-table td.bs-scan360__scores-gap {
  text-align: right;
  font-style: italic;
  color: #5C6478;
}
.360fe_TNV .bs-scan360__scores-note {
  font-size: 12px;
  color: #5C6478;
  font-style: italic;
  margin-top: 20px;
  line-height: 1.5;
}
.360fe_TNV .bs-scan360__footer {
  border-top: 1px solid #E8EDF4;
  padding: 20px 40px;
  font-size: 11px;
  color: #5C6478;
  display: flex;
  justify-content: space-between;
}
.360fe_TNV .bs-scan360__footer strong {
  color: #1A3877;
}
.360fe_TNV .bs-scan360__intro {
  margin: 0 0 16px;
  font-size: 13px;
  color: #5C6478;
  line-height: 1.6;
}
.360fe_TNV .bs-scan360__divider {
  border: 0;
  border-top: 1px solid #E8EDF4;
  margin: 32px 0;
}
.360fe_TNV .bs-scan360 .chart-wrapper {
  max-width: 900px;
  margin: 24px auto;
  background: #FFFFFF;
  color: #1A2438;
  font-family: Calibri, Arial, sans-serif;
  padding: 32px 40px 40px;
}
@media print {
  .360fe_TNV .bs-scan360__section {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__profile {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__card {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__gap-row {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__growth {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__timeline-item {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__verbreding {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__spider-wrap {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__scores-table {
    page-break-inside: avoid;
  }
}
.360fe_TNV .IsamBerenschotMaster .sv_q_checkbox_label {
  font-size: 18px;
}
.360fe_TNV .IsamBerenschotMaster .sv_main .sv_container .sv_body .sv_p_root .sv_q_radiogroup_label {
  font-size: 18px;
  display: flex;
}
.360fe_TNV .IsamBerenschotMaster .sv_main .sv_container .sv_body .sv_p_root .sv_q_radiogroup_label .sv_q_radiogroup_control_item {
  flex: none;
  margin-top: 4px;
  outline: none !important;
}
.360fe_TNV .IsamBerenschotMaster .sv-ranking-item_content {
  font-size: 16px;
}
.360fe_TNV .IsamBerenschotMaster .sv_q_rating_min_text {
  margin: 0px 18px 0px 0px !important;
}
.360fe_TNV .IsamBerenschotMaster .sv_progress {
  font-size: 18px;
  font-family: Default-Light;
}
.360fe_TNV .IsamBerenschotMaster .sv_p_title {
  padding: 0px;
  font-family: Montserrat-Bold;
  font-size: 20px;
}
.360fe_TNV .IsamBerenschotMaster .sv_q_description {
  font-size: 18px;
  font-family: Default-Light !important;
}
.360fe_TNV .IsamBerenschotMaster .sv_page_title {
  font-size: 28px;
  color: bs-blue;
  font-family: Montserrat-Bold;
}
.360fe_TNV .IsamBerenschotMaster .sv_page_description {
  font-size: 20px;
  font-family: Default-Light;
}
.360fe_TNV .IsamBerenschotMaster .sv_q_title {
  font-size: 1.1em;
  font-family: Montserrat-Medium;
}
.360fe_TNV .IsamBerenschotMaster .sv-action-bar.sv_nav {
  padding: 50px 0 15px 0;
}
.360fe_TNV .IsamBerenschotMaster .sv_q_rating_item_text {
  font-size: 20px;
  font-family: Default-Regular;
  margin: 15px;
  min-width: 48px !important;
  border-radius: 0px;
  border: 1px solid #1a3878 !important;
  transition: background-color 0.2s ease-in-out;
}
.360fe_TNV .IsamBerenschotMaster .sv_q_rating_item_text:hover {
  box-shadow: none;
  background: #1a3878;
  color: #ffffff;
}
.360fe_TNV .IsamBerenschotMaster .hide-default-link a {
  text-decoration: none;
  color: inherit;
}
.360fe_TNV .IsamBerenschotMaster .floating-content {
  top: 72px;
}
.360fe_TNV .IsamBerenschotMaster .middle-bar {
  border-bottom: 1px solid #e0e0e0;
  box-shadow: 0px 4px 4px -2px rgba(0, 0, 0, 0.1);
}
.360fe_TNV .IsamBerenschotMaster .middle-bar-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.360fe_TNV .IsamBerenschotMaster .middle-bar-inner .links {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
}
.360fe_TNV .IsamBerenschotMaster .middle-bar-inner .links .nav-item {
  font-family: Montserrat-Bold !important;
  font-size: 16px;
  padding: 20px 0px 20px 0px;
}
.360fe_TNV .IsamBerenschotMaster .middle-bar-inner .logo img {
  width: 60%;
  height: 60%;
  display: flex;
  padding: 20px 0 20px 0;
  /* Responsive layout - when the screen is <576px wide */
}
@charset "UTF-8";
.360fe_TNV .IsamBerenschotMaster .navbar {
  padding: 0 !important;
}
.360fe_TNV .IsamBerenschotMaster .navbar .nav-item {
  padding: 0 1rem;
}
.360fe_TNV .IsamBerenschotMaster .navbar .navbar-nav .nav-link {
  color: #1a3878 !important;
  font-family: Montserrat-Bold;
  cursor: pointer;
}
.360fe_TNV .IsamBerenschotMaster .navbar .navbar-nav .nav-link:hover {
  color: #3eb6eb !important;
}
.360fe_TNV .IsamBerenschotMaster .navbar .nav-link.active,
.360fe_TNV .IsamBerenschotMaster .navbar .nav-link.active-parent,
.360fe_TNV .IsamBerenschotMaster .navbar .show > .nav-link {
  font-family: Montserrat-Bold;
  border-bottom: 1px solid var(--base-color);
}
.360fe_TNV .IsamBerenschotMaster .navbar .navbar-collapse {
  justify-content: center;
}
.360fe_TNV .IsamBerenschotMaster .navbar .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8, %3Csvg viewBox=’0 0 32 32′ xmlns=’http://www.w3.org/2000/svg’%3E%3Cpath stroke=’rgba(0, 0, 0, 0.5)’ stroke-width=’2′ stroke-linecap=’round’ stroke-miterlimit=’10’ d=’M4 8h24M4 16h24M4 24h24’/%3E%3C/svg%3E");
  width: 2.5em;
  height: 2em;
}
.360fe_TNV .IsamBerenschotMaster .navbar .navbar-toggler i {
  color: var(--black-color);
  font-size: 2rem;
}
.360fe_TNV .IsamBerenschotMaster .navbar .navbar-toggler:focus {
  box-shadow: 0 0 0 0rem !important;
}
.360fe_TNV .IsamBerenschotMaster .button-class {
  justify-content: center;
}
.360fe_TNV .IsamBerenschotMaster .button-class .button {
  min-width: 170px;
  text-align: center;
  text-decoration: none;
}
@charset "UTF-8";
.360fe_TNV .IsamBerenschotMaster {
  /* Grid tabs — selected tab in brand red */
  /* Hover on non-selected tabs — subtle red */
  /* Optional: inactive tabs in muted navy */
}
.360fe_TNV .IsamBerenschotMaster .grid-tabs .grid-tab.selected-grid-tab,
.360fe_TNV .IsamBerenschotMaster .grid-tabs .grid-tab.selected-grid-tab .hide-text-overlfow,
.360fe_TNV .IsamBerenschotMaster .grid-tabs .grid-tab.selected-grid-tab .line-clamp {
  color: #a01b30 !important;
  border-color: #a01b30 !important;
  background-color: transparent !important;
}
.360fe_TNV .IsamBerenschotMaster .grid-tabs .grid-tab:not(.selected-grid-tab):hover,
.360fe_TNV .IsamBerenschotMaster .grid-tabs .grid-tab:not(.selected-grid-tab):hover .hide-text-overlfow {
  color: #a01b30 !important;
}
.360fe_TNV .IsamBerenschotMaster .grid-tabs .grid-tab:not(.selected-grid-tab),
.360fe_TNV .IsamBerenschotMaster .grid-tabs .grid-tab:not(.selected-grid-tab) .hide-text-overlfow {
  color: #94a3b8;
}
.360fe_TNV .IsamBerenschotMaster .page-menu {
  min-height: 100%;
  padding-left: 0;
}
.360fe_TNV .IsamBerenschotMaster .page-menu li a {
  font-family: Default-Bold !important;
}
.360fe_TNV .IsamBerenschotMaster .Isam .Button .button__Ghost {
  border: 1px solid;
}
.360fe_TNV .IsamBerenschotMaster .login-button .button__Primary {
  font-size: 16px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  border-radius: 0px;
  font-family: Montserrat-Bold;
}
.360fe_TNV .IsamBerenschotMaster .login-button .button-class .button {
  min-width: 100px;
  text-align: center;
  text-decoration: none;
}
.360fe_TNV .IsamBerenschotMaster .button-fill .button-class .button {
  width: -webkit-fill-available;
}
.360fe_TNV .IsamBerenschotMaster .button__Ghost {
  border: 1px solid;
}
.360fe_TNV .IsamBerenschotMaster .search-select-box .search-options {
  font: Default-Regular !important;
  font-size: 16px;
}
@charset "UTF-8";
.360fe_TNV .IsamBerenschotMaster .steps {
  /* ============================================================
    Brand palette:
    #5b0a4d  deep purple   (primary / current / passed) replace with #267bbe (Middle Blue) -> replace #ab6c02 (BSC DarkBrown)
    #a01b30   red      (form accent / selected) replace with darkBlue #223b4f (Dark Blue) -> replace #1a3878 (BSC DarkBlue)
    #e43226  vibrant red   (hover / active)
    #eb7418  orange        (reserved accent)
    #223b4f  dark navy     (neutral text / outlines)
  ============================================================ */
  /* ---- 1. Theme variable overrides (drives most accents) ---- */
  /* Forceer dat de connector van het EERSTE item rendert
     (SurveyJS verbergt 'm standaard met :first-child) */
  /* ---- 2. Progress buttons (top stepper) ---- */
  /* Connector line — default (incomplete, gray) */
  /* Default circle (clickable, not yet visited) */
  /* PASSED step — completed, filled red with checkmark */
  /* Filled progress trail — line going OUT of a passed step */
  /* CURRENT step — bigger, filled, with halo */
  /* Current's outgoing connector stays gray (next step still incomplete) */
  /* LOCKED steps (nonclickable) */
  /* Hover on clickable, non-current, non-passed steps */
  /* ---- 3. Radio buttons — only the CHECKED one is red ---- */
  /* ---- 4. Checkboxes ---- */
  /* ---- 5. Hover (alleen subtiel op het rondje, geen rij-achtergrond) ---- */
  /* ---- 6. Focus rings — only for keyboard nav ---- */
  /* ---- 7. Boolean / switch toggle ---- */
  /* ---- 8. Primary action buttons (Next, Submit) ---- */
  /* ---- 9. Rating scale ---- */
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-page .sd-question:first-of-type,
.360fe_TNV .IsamBerenschotMaster .steps .sd-question--first {
  scroll-margin-top: 250px;
  /* hoogte van stepper + eventuele header */
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list > li:first-child .sd-progress-buttons__connector {
  display: block !important;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-root-modern,
.360fe_TNV .IsamBerenschotMaster .steps .sd-body,
.360fe_TNV .IsamBerenschotMaster .steps .sv-root,
.360fe_TNV .IsamBerenschotMaster .steps :root {
  --sjs-primary-backcolor: #1a3878;
  --sjs-primary-backcolor-light: rgba(160, 27, 48, 0.10);
  --sjs-primary-backcolor-dark: #e43226;
  --sjs-primary-forecolor: #ffffff;
  --sjs-primary-forecolor-light: rgba(255, 255, 255, 0.25);
  --sjs-border-default: #e2e8f0;
  --sjs-border-light: #f1f5f9;
  --sjs-special-red: #e43226;
  --sjs-special-red-light: rgba(228, 50, 38, 0.10);
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons {
  padding: 8px 0 7px;
  background: transparent;
  font-family: var(--font-sans, -apple-system, "Segoe UI", system-ui, sans-serif);
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__container {
  max-width: 100%;
  margin: 0 auto;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list-container {
  width: 100%;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  position: relative;
  counter-reset: step-counter;
  align-items: center;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list > li {
  flex: 1;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  padding: 4px;
  counter-increment: step-counter;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__page-title {
  font-size: 13px;
  font-weight: 500;
  color: #94a3b8;
  text-align: center;
  line-height: 1.35;
  height: 38px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  margin-bottom: 14px;
  padding: 0 4px;
  letter-spacing: 0.01em;
  transition: color 0.2s ease;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__page-description {
  display: none;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__connector {
  position: absolute;
  top: 76px;
  left: 50%;
  width: 100%;
  height: 2px;
  background: #cbd5e1 !important;
  border-radius: 2px;
  z-index: 0;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list > li:last-child .sd-progress-buttons__connector {
  display: none;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__button {
  position: relative;
  z-index: 1;
  width: 36px;
  height: 36px;
  margin: 6px 0;
  border-radius: 50%;
  background: #ffffff;
  border: 1.5px solid #1a3878;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__button-background,
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__button-content,
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__button span {
  display: none;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__button::before {
  content: counter(step-counter);
  font-size: 14px;
  font-weight: 500;
  color: #1a3878;
  font-variant-numeric: tabular-nums;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list-element--passed .sd-progress-buttons__page-title {
  color: #1a3878;
  /* was #ab6c02 */
  font-weight: 500;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list-element--passed .sd-progress-buttons__button {
  background: #1a3878;
  /* was #ab6c02 */
  border: 2px solid #1a3878;
  /* was #ab6c02 */
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list-element--passed .sd-progress-buttons__button::before {
  content: "✓";
  color: #ffffff;
  font-size: 15px;
  font-weight: 600;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list-element--passed .sd-progress-buttons__connector {
  background: #1a3878 !important;
  /* was #ab6c02 */
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list-element--current .sd-progress-buttons__page-title {
  color: #ab6c02;
  font-weight: 600;
  font-size: 14px;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list-element--current .sd-progress-buttons__button {
  width: 48px;
  height: 48px;
  margin: 0;
  background: #ab6c02;
  border: 2px solid #ab6c02;
  box-shadow: 0 0 0 4px rgba(91, 10, 77, 0.1);
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list-element--current .sd-progress-buttons__button::before {
  color: #ffffff;
  font-size: 17px;
  font-weight: 600;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list-element--current .sd-progress-buttons__connector {
  background: #cbd5e1 !important;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list-element--nonclickable {
  cursor: default;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list-element--nonclickable .sd-progress-buttons__page-title {
  color: #9ca3af;
  font-weight: 400;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list-element--nonclickable .sd-progress-buttons__button {
  width: 32px;
  height: 32px;
  margin: 8px 0;
  background: #f8fafc;
  border: 1.25px solid #d1d5db;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list-element--nonclickable .sd-progress-buttons__button::before {
  color: #9ca3af;
  font-weight: 400;
  font-size: 13px;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list > li:not(.sd-progress-buttons__list-element--current):not(.sd-progress-buttons__list-element--nonclickable):not(.sd-progress-buttons__list-element--passed):hover .sd-progress-buttons__button {
  border-color: #1a3878;
  background: #ECF0F4;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list > li:not(.sd-progress-buttons__list-element--current):not(.sd-progress-buttons__list-element--nonclickable):not(.sd-progress-buttons__list-element--passed):hover .sd-progress-buttons__button::before,
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__list > li:not(.sd-progress-buttons__list-element--current):not(.sd-progress-buttons__list-element--nonclickable):not(.sd-progress-buttons__list-element--passed):hover .sd-progress-buttons__page-title {
  color: #1a3878;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__image-button-left,
.360fe_TNV .IsamBerenschotMaster .steps .sd-progress-buttons__image-button-right {
  display: none;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-radio__control:checked + .sd-radio__decorator,
.360fe_TNV .IsamBerenschotMaster .steps .sd-item__control:checked + .sd-radio__decorator {
  border-color: #1a3878 !important;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-radio__control:checked + .sd-radio__decorator::after,
.360fe_TNV .IsamBerenschotMaster .steps .sd-item__control:checked + .sd-radio__decorator::after {
  background-color: #1a3878 !important;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-checkbox__control:checked + .sd-checkbox__decorator,
.360fe_TNV .IsamBerenschotMaster .steps .sd-item__control:checked + .sd-checkbox__decorator {
  background-color: #1a3878 !important;
  border-color: #1a3878 !important;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-selectbase__label:hover .sd-radio__decorator,
.360fe_TNV .IsamBerenschotMaster .steps .sd-selectbase__label:hover .sd-checkbox__decorator {
  border-color: #1a3878 !important;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-radio__control:focus-visible + .sd-radio__decorator,
.360fe_TNV .IsamBerenschotMaster .steps .sd-checkbox__control:focus-visible + .sd-checkbox__decorator,
.360fe_TNV .IsamBerenschotMaster .steps .sd-item__control:focus-visible + .sd-radio__decorator,
.360fe_TNV .IsamBerenschotMaster .steps .sd-item__control:focus-visible + .sd-checkbox__decorator,
.360fe_TNV .IsamBerenschotMaster .steps .sd-input:focus-visible,
.360fe_TNV .IsamBerenschotMaster .steps .sd-dropdown:focus-visible {
  outline: 2px solid #1a3878 !important;
  outline-offset: 2px !important;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-boolean--checked .sd-boolean__thumb,
.360fe_TNV .IsamBerenschotMaster .steps .sd-boolean__switch:has(input:checked) {
  background-color: #1a3878 !important;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-btn--action,
.360fe_TNV .IsamBerenschotMaster .steps .sd-navigation__complete-btn,
.360fe_TNV .IsamBerenschotMaster .steps .sd-navigation__next-btn {
  background-color: #1a3878 !important;
  border-color: #1a3878 !important;
  color: #ffffff !important;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-btn--action:hover,
.360fe_TNV .IsamBerenschotMaster .steps .sd-navigation__complete-btn:hover,
.360fe_TNV .IsamBerenschotMaster .steps .sd-navigation__next-btn:hover {
  background-color: #e43226 !important;
  border-color: #e43226 !important;
}
.360fe_TNV .IsamBerenschotMaster .steps .sd-rating__item--selected,
.360fe_TNV .IsamBerenschotMaster .steps .sd-rating__item-text--selected {
  background-color: #1a3878 !important;
  color: #ffffff !important;
  border-color: #1a3878 !important;
}
@charset "UTF-8";
.360fe_TNV .IsamBerenschotMaster {
  /* ── Buiten alle nesting ── */
}
.360fe_TNV .IsamBerenschotMaster .top-bar {
  background: linear-gradient(to right, #1a3878, #1a3878);
  padding: 0.25rem;
  color: #ffffff;
  font-size: var(--font-size);
}
.360fe_TNV .IsamBerenschotMaster .top-bar .top-bar-inner {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  align-self: center;
  color: #ffffff;
}
@media (max-width: 575.98px) {
  .360fe_TNV .IsamBerenschotMaster .top-bar .top-bar-inner {
    flex-direction: column;
  }
}
.360fe_TNV .IsamBerenschotMaster .top-bar .top-bar-inner .navbar .nav-item {
  padding: 0px 2px !important;
}
.360fe_TNV .IsamBerenschotMaster .top-bar .top-bar-inner .navbar .nav-item .nav-link {
  padding: 0px !important;
}
.360fe_TNV .IsamBerenschotMaster .top-bar .top-bar-inner span {
  font-size: 13px;
  color: #ffffff;
  font-family: Montserrat-Medium;
}
.360fe_TNV .IsamBerenschotMaster .top-bar .top-bar-inner .language-container {
  position: relative;
}
.360fe_TNV .IsamBerenschotMaster .top-bar .top-bar-inner .language-container .language-select-label {
  position: absolute;
  pointer-events: none;
}
.360fe_TNV .IsamBerenschotMaster .top-bar .top-bar-inner .language-container .language-select-label svg path {
  fill: #ffffff;
}
.360fe_TNV .IsamBerenschotMaster .top-bar .top-bar-inner .language-container .language-select {
  padding: 2px 4px 2px 24px;
  border: none;
  appearance: none;
  background-color: transparent;
  color: #ffffff;
  line-height: 26px !important;
}
.360fe_TNV .IsamBerenschotMaster .top-bar .top-bar-inner .language-container .language-select option {
  color: #000;
  font-size: 11px;
}
.360fe_TNV .IsamBerenschotMaster .top-bar .links ul {
  margin-bottom: 0 !important;
  list-style-type: none !important;
}
@media (max-width: 575.98px) {
  .360fe_TNV .IsamBerenschotMaster .top-bar .links ul {
    padding-left: 0px;
  }
}
.360fe_TNV .IsamBerenschotMaster .top-bar .links ul li {
  list-style-type: none !important;
  display: inline;
  padding: 0 0.5em;
}
.360fe_TNV .IsamBerenschotMaster .top-bar .links ul li a {
  text-transform: none !important;
  font-weight: 500 !important;
  font-family: var(--font-content) !important;
  color: var(--white-color) !important;
  font-size: 13px !important;
}
.360fe_TNV .IsamBerenschotMaster .top-bar .links ul li a:hover {
  text-decoration: underline !important;
}
.360fe_TNV .IsamBerenschotMaster .top-bar .user-info-section {
  font-size: 14px !important;
  color: #ffffff;
}
.360fe_TNV .IsamBerenschotMaster .top-bar .user-info-section img {
  height: 15px;
}
.360fe_TNV .IsamBerenschotMaster .top-bar .user-info-section li {
  list-style-type: none;
}
.360fe_TNV .IsamBerenschotMaster .top-bar .user-info-section a {
  text-transform: none !important;
  font-weight: 500 !important;
  font-family: var(--font-content) !important;
  margin-left: 10px;
  font-size: 13px !important;
}
@media (max-width: 575.98px) {
  .360fe_TNV .IsamBerenschotMaster .top-bar .user-info-section a {
    margin: auto;
    text-align: center;
    display: block;
  }
}
.360fe_TNV .IsamBerenschotMaster .top-bar .user-info-section a:hover {
  color: #6CA7ED !important;
  text-decoration: underline !important;
}
.360fe_TNV .IsamBerenschotMaster .language-select option[value=en],
.360fe_TNV .IsamBerenschotMaster .language-select option[value=pl],
.360fe_TNV .IsamBerenschotMaster .language-select option[value=es],
.360fe_TNV .IsamBerenschotMaster .language-select option[value=pt],
.360fe_TNV .IsamBerenschotMaster .language-select option[value=zh],
.360fe_TNV .IsamBerenschotMaster .language-select option[value=fr] {
  display: none;
}
.360fe_TNV .IsamBerenschotMaster ul.navbar-nav {
  display: flex;
  flex-direction: row;
  padding: 0;
  margin: 0;
  list-style: none;
}
.360fe_TNV .IsamBerenschotMaster ul.navbar-nav li {
  margin-right: 1rem;
}
.360fe_TNV .IsamBerenschotMaster ul.navbar-nav li:last-child {
  margin-right: 0;
}
.360fe_TNV .IsamBerenschotMaster ul.navbar-nav li a.nav-link {
  font-family: "Default-Bold";
  font-size: 16px;
}
.360fe_TNV .IsamBerenschotMaster ul.navbar-nav .nav-link.active,
.360fe_TNV .IsamBerenschotMaster ul.navbar-nav .nav-link.active-parent,
.360fe_TNV .IsamBerenschotMaster ul.navbar-nav .show > .nav-link {
  font-weight: regular;
  color: var(--primary-color-1200);
  border-bottom: 0px solid var(--primary-color-1200);
}
@charset "UTF-8";
.360fe_TNV {
  /* Berenschot Sales Competency Scan — Rapport CSS (v2, Bisbrick-safe)
  *
  * Wijzigingen t.o.v. v1 om SCSS-parser errors te voorkomen:
  *   1. body { } selector verwijderd  (Bisbrick regelt eigen body)
  *   2. .bs-scan * universal selector verwijderd
  *   3. @media print { } block verwijderd  (page-breaks nu via losse regels)
  *   4. ::after met content-string verwijderd  (Berenschot-tekst nu via HTML-element)
  *   5. Overal spatie na colon: "color: #FFF" ipv "color:#FFF"  (voorkomt #-interpolatie-conflict)
  *   6. Font-family zonder quotes: Calibri, Arial, sans-serif
  *
  * CSS-namespace .bs-scan om interferentie met host-styling te voorkomen.
  *
  * Kleuren:
  *   Navy:  #1A3877  (Berenschot primair)
  *   Gold:  #C9A961  (accent, top sterktes)
  *   Text:  #1A2438
  *   Muted: #5C6478
  *   Light: #E8EDF4
  */
  /* --- Header --- */
  /* --- Body wrapper --- */
  /* --- Section --- */
  /* --- Sectie 1: Profiel --- */
  /* --- Sectie 2: Kracht in actie --- */
  /* Sectie 2: micro-actie regel */
  /* --- Sectie 3: Groei-routes (4-cell) --- */
  /* --- Sectie 4: Learning path timeline --- */
  /* --- Sectie 5: Verbreding --- */
  /* --- Sectie 6: Spider + tabel --- */
  /* --- Footer --- */
  /* --- Intro-tekst boven sectie 1 --- */
  /* --- Divider --- */
}
.360fe_TNV .bs-scan {
  max-width: 900px;
  margin: 24px auto;
  background: #FFFFFF;
  color: #1A2438;
  font-family: Calibri, Arial, sans-serif;
}
.360fe_TNV .bs-scan__header {
  background: #1A3877;
  color: #FFFFFF;
  padding: 32px 40px 24px;
  position: relative;
}
.360fe_TNV .bs-scan__header-eyebrow {
  font-size: 11px;
  letter-spacing: 3px;
  font-weight: 700;
  color: #C9A961;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.360fe_TNV .bs-scan__header-title {
  font-size: 26px;
  font-weight: 700;
  margin: 0 0 4px;
  color: #FFFFFF;
}
.360fe_TNV .bs-scan__header-meta {
  font-size: 13px;
  color: #B8C5DD;
  margin-top: 10px;
}
.360fe_TNV .bs-scan__header-brand {
  position: absolute;
  top: 32px;
  right: 40px;
  font-size: 14px;
  font-weight: 700;
  color: #FFFFFF;
  letter-spacing: 0.5px;
}
.360fe_TNV .bs-scan__body {
  padding: 32px 40px 40px;
}
.360fe_TNV .bs-scan__section {
  margin-bottom: 32px;
  page-break-inside: avoid;
}
.360fe_TNV .bs-scan__section-label {
  font-size: 10px;
  letter-spacing: 4px;
  color: #5C6478;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.360fe_TNV .bs-scan__section-title {
  font-size: 22px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 4px;
}
.360fe_TNV .bs-scan__section-lead {
  font-size: 13px;
  color: #5C6478;
  font-style: italic;
  margin: 0 0 20px;
}
.360fe_TNV .bs-scan__profile {
  background: #1A3877;
  color: #FFFFFF;
  padding: 28px 32px;
  margin-top: 8px;
  page-break-inside: avoid;
}
.360fe_TNV .bs-scan__profile-narrative {
  font-size: 14px;
  color: #EAEDF4;
  line-height: 1.55;
  margin: 20px 0 0;
}
.360fe_TNV .bs-scan__profile-narrative strong {
  color: #FFFFFF;
  font-weight: 700;
}
.360fe_TNV .bs-scan__strengths-headline {
  margin-top: 6px;
  font-size: 11px;
  letter-spacing: 3px;
  color: #C9A961;
  font-weight: 700;
  text-transform: uppercase;
}
.360fe_TNV .bs-scan__strengths-list {
  font-size: 15px;
  font-weight: 700;
  color: #FFFFFF;
  margin: 6px 0 0;
  line-height: 1.4;
}
.360fe_TNV .bs-scan__strengths-list span {
  color: #C9A961;
  margin: 0 6px;
}
.360fe_TNV .bs-scan__bars {
  margin-top: 24px;
}
.360fe_TNV .bs-scan__bar-row {
  display: flex;
  align-items: center;
  margin-bottom: 8px;
  font-size: 12px;
}
.360fe_TNV .bs-scan__bar-label {
  width: 200px;
  color: #D5DEEB;
  font-weight: 500;
  font-size: 11.5px;
}
.360fe_TNV .bs-scan__bar-label--primary {
  color: #C9A961;
  font-weight: 700;
}
.360fe_TNV .bs-scan__bar-track {
  flex: 1;
  height: 10px;
  background: #33538E;
  position: relative;
}
.360fe_TNV .bs-scan__bar-fill {
  height: 10px;
  background: #C9A961;
}
.360fe_TNV .bs-scan__bar-fill--muted {
  background: #5F7CA8;
}
.360fe_TNV .bs-scan__bar-value {
  width: 42px;
  text-align: right;
  color: #D5DEEB;
  font-size: 12px;
  margin-left: 12px;
  font-weight: 600;
}
.360fe_TNV .bs-scan__bar-value--primary {
  color: #C9A961;
  font-weight: 700;
}
.360fe_TNV .bs-scan__two-col {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 20px 0;
  margin-left: -20px;
  margin-right: -20px;
}
.360fe_TNV .bs-scan__col {
  display: table-cell;
  width: 50%;
  vertical-align: top;
}
.360fe_TNV .bs-scan__card {
  background: #F5F7FA;
  padding: 20px 22px;
  border-top: 3px solid #1A3877;
  page-break-inside: avoid;
}
.360fe_TNV .bs-scan__card--gold {
  border-top-color: #C9A961;
}
.360fe_TNV .bs-scan__item {
  margin-bottom: 16px;
}
.360fe_TNV .bs-scan__item:last-child {
  margin-bottom: 0;
}
.360fe_TNV .bs-scan__item-title {
  font-size: 14px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 4px;
}
.360fe_TNV .bs-scan__item-body {
  font-size: 12.5px;
  color: #1A2438;
  margin: 0;
  line-height: 1.5;
}
.360fe_TNV .bs-scan__action {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px dashed #D5DEEB;
  font-size: 12px;
  color: #1A3877;
}
.360fe_TNV .bs-scan__action-label {
  font-weight: 700;
  color: #C9A961;
  letter-spacing: 2px;
  font-size: 10px;
  text-transform: uppercase;
  margin-right: 6px;
}
.360fe_TNV .bs-scan__growth {
  margin-bottom: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid #E8EDF4;
  page-break-inside: avoid;
}
.360fe_TNV .bs-scan__growth:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.360fe_TNV .bs-scan__growth-title {
  font-size: 15px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 12px;
  display: flex;
  align-items: baseline;
}
.360fe_TNV .bs-scan__growth-number {
  color: #C9A961;
  font-weight: 700;
  margin-right: 10px;
  font-size: 18px;
}
.360fe_TNV .bs-scan__growth-module {
  font-size: 11px;
  color: #5C6478;
  font-weight: 500;
  font-style: italic;
  margin-left: auto;
  letter-spacing: 1px;
}
.360fe_TNV .bs-scan__growth-grid {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 10px 0;
  margin-left: -10px;
  margin-right: -10px;
}
.360fe_TNV .bs-scan__growth-cell {
  display: table-cell;
  width: 25%;
  vertical-align: top;
}
.360fe_TNV .bs-scan__growth-cell-label {
  font-size: 9px;
  letter-spacing: 3px;
  color: #C9A961;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.360fe_TNV .bs-scan__growth-cell-body {
  font-size: 12px;
  color: #1A2438;
  line-height: 1.45;
}
.360fe_TNV .bs-scan__timeline {
  position: relative;
  padding-left: 22px;
}
.360fe_TNV .bs-scan__timeline-line {
  position: absolute;
  left: 6px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: #1A3877;
}
.360fe_TNV .bs-scan__timeline-item {
  position: relative;
  margin-bottom: 22px;
  page-break-inside: avoid;
}
.360fe_TNV .bs-scan__timeline-item:last-child {
  margin-bottom: 0;
}
.360fe_TNV .bs-scan__timeline-marker {
  position: absolute;
  left: -22px;
  top: 4px;
  width: 14px;
  height: 14px;
  background: #1A3877;
  border-radius: 50%;
  border: 3px solid #FFFFFF;
  box-shadow: 0 0 0 2px #1A3877;
}
.360fe_TNV .bs-scan__timeline-marker--gold {
  background: #C9A961;
  box-shadow: 0 0 0 2px #C9A961;
}
.360fe_TNV .bs-scan__timeline-horizon {
  font-size: 10px;
  letter-spacing: 3px;
  font-weight: 700;
  color: #C9A961;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.360fe_TNV .bs-scan__timeline-headline {
  font-size: 15px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 8px;
}
.360fe_TNV .bs-scan__timeline-list {
  margin: 0;
  padding-left: 0;
  list-style: none;
}
.360fe_TNV .bs-scan__timeline-list li {
  font-size: 12.5px;
  color: #1A2438;
  line-height: 1.5;
  padding-left: 14px;
  position: relative;
  margin-bottom: 4px;
}
.360fe_TNV .bs-scan__timeline-list li strong {
  color: #1A3877;
}
.360fe_TNV .bs-scan__timeline-arrow {
  color: #C9A961;
  font-weight: 700;
  margin-right: 6px;
}
.360fe_TNV .bs-scan__verbreding {
  background: #FAF6ED;
  padding: 20px 24px;
  border-left: 3px solid #C9A961;
  page-break-inside: avoid;
}
.360fe_TNV .bs-scan__verbreding-label {
  font-size: 10px;
  letter-spacing: 3px;
  color: #C9A961;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.360fe_TNV .bs-scan__verbreding-title {
  font-size: 15px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 6px;
}
.360fe_TNV .bs-scan__verbreding-body {
  font-size: 13px;
  color: #1A2438;
  margin: 0;
  line-height: 1.5;
}
.360fe_TNV .bs-scan__spider-wrap {
  text-align: center;
  margin: 16px 0 0;
  page-break-inside: avoid;
}
.360fe_TNV .bs-scan__spider-wrap img {
  max-width: 640px;
  width: 100%;
  height: auto;
}
.360fe_TNV .bs-scan__scores-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 20px;
  font-size: 12px;
  page-break-inside: avoid;
}
.360fe_TNV .bs-scan__scores-table th {
  text-align: left;
  padding: 8px 10px;
  background: #F5F7FA;
  color: #5C6478;
  font-weight: 700;
  letter-spacing: 2px;
  font-size: 10px;
  text-transform: uppercase;
  border-bottom: 2px solid #E8EDF4;
}
.360fe_TNV .bs-scan__scores-table td {
  padding: 8px 10px;
  border-bottom: 1px solid #E8EDF4;
  color: #1A2438;
}
.360fe_TNV .bs-scan__scores-table td.bs-scan__scores-comp {
  font-weight: 700;
  color: #1A3877;
}
.360fe_TNV .bs-scan__scores-table td.bs-scan__scores-bsm {
  color: #5C6478;
}
.360fe_TNV .bs-scan__scores-table td.bs-scan__scores-score {
  text-align: right;
  font-weight: 700;
  color: #1A3877;
}
.360fe_TNV .bs-scan__scores-table td.bs-scan__scores-verwacht {
  color: #5C6478;
  text-align: right;
  font-style: italic;
}
.360fe_TNV .bs-scan__scores-note {
  font-size: 12px;
  color: #5C6478;
  font-style: italic;
  margin-top: 20px;
  line-height: 1.5;
}
.360fe_TNV .bs-scan__footer {
  border-top: 1px solid #E8EDF4;
  padding: 20px 40px;
  font-size: 11px;
  color: #5C6478;
  display: flex;
  justify-content: space-between;
}
.360fe_TNV .bs-scan__footer strong {
  color: #1A3877;
}
.360fe_TNV .bs-scan__intro {
  margin: 0 0 16px;
  font-size: 13px;
  color: #5C6478;
  line-height: 1.6;
}
.360fe_TNV .bs-scan__divider {
  border: 0;
  border-top: 1px solid #E8EDF4;
  margin: 32px 0;
}
@charset "UTF-8";
.360fe_TNV {
  /* Berenschot 360° Feedback Scan — Rapport SCSS (v1)
  *
  * Gebaseerd op Sales Competency Scan CSS v2 (Bisbrick-safe), met opzet ÉÉN afwijking:
  *   1. Geen body {} selector (Bisbrick regelt eigen body)
  *   2. Geen universal selector (.bs-scan *)
  *   3. @media print {} bewust WEL aanwezig (zie onderaan dit bestand) — op verzoek, zodat
  *      alle print/page-break-regels op één plek staan i.p.v. verspreid over elke selector.
  *      LET OP: dit was in v1→v2 van de Sales Competency Scan-CSS juist verwijderd omdat het
  *      de Bisbrick scss→css-Function liet crashen. Als je dit bestand ongewijzigd door die
  *      Function haalt, is de kans groot dat dezelfde parserfout terugkomt. Test dat eerst
  *      met een kleine losse @media-blok voordat je het hele bestand erdoorheen haalt, of
  *      strip dit blok in een build-stap vlak vóór opslag in de DB als het toch faalt.
  *   4. Geen ::after met content-string (Berenschot-tekst via HTML-element)
  *   5. Overal spatie na colon: "color: #FFF" ipv "color:#FFF"
  *   6. Font-family zonder quotes voor single-word namen: Calibri, Arial, sans-serif
  *      (multi-word namen als "Segoe UI" hebben wel quotes nodig, dat is normale CSS-syntax,
  *      geen SCSS-interpolatie-risico)
  *
  * CSS-namespace .bs-scan360 (bewust anders dan .bs-scan, zodat beide rapporten los van
  * elkaar in dezelfde tenant-theme kunnen bestaan zonder class-collision).
  *
  * Basiskleuren (ongewijzigd t.o.v. Sales Competency Scan):
  *   Navy:  #1A3877  (Berenschot primair)
  *   Gold:  #C9A961  (accent, bevestigde sterktes)
  *   Text:  #1A2438
  *   Muted: #5C6478
  *   Light: #E8EDF4
  *
  * Nieuwe kleuren voor 360-specifieke duiding (NIET uit het Berenschot-merkboek gehaald —
  * ter kalibratie voorleggen, net als de maturiteits-labels zelf al "definitief te bevestigen"
  * zijn volgens het README-tabblad van de matrix):
  *   Blinde vlek (zelf hoger dan anderen):     #B2622E  (warme terracotta, geen alarmrood)
  *   Verborgen kracht (anderen hoger dan zelf): #3E8074  (gedempt groen/teal)
  *   Bevestigd / aligned:                       #5C6478  (zelfde als Muted, bewust neutraal)
  */
  /* --- Header --- */
  /* --- Body wrapper --- */
  /* --- Section --- */
  /* --- Sectie 1: Profiel --- */
  /* Dual bars: per competentie twee dunne tracks (zelf / anderen) i.p.v. één bar.
     Bewust GEEN overlappende/gestapelde bars in CSS-only — simpeler en stabieler
     in html-naar-pdf/jsreport rendering dan absolute-positioned overlays. */
  /* --- Archetype-vergelijking (zelf vs anderen), onderdeel van Sectie 1 --- */
  /* --- Sectie 2: Bevestigde kracht in actie --- */
  /* --- Sectie 3: Zelfinzicht (blinde vlekken / verborgen krachten) --- */
  /* --- Sectie 4: Groei-routes (4-cell, ongewijzigd van Sales Competency Scan) --- */
  /* --- Sectie 5: Learning path timeline (ongewijzigd) --- */
  /* --- Sectie 6: Verbreding (ongewijzigd) --- */
  /* --- Sectie 7: Maturiteits-context (spider + tabel) --- */
  /* --- Footer --- */
  /* --- Intro --- */
  /* --- Divider --- */
  /* --- Spider --- */
  /* --- Print / PDF page breaks ---
   * Zie waarschuwing bovenaan dit bestand: dit blok is bewust behouden op verzoek, maar was
   * de oorzaak van de SCSS-parserfout in de vorige versie van de Sales Competency Scan-CSS.
   */
}
.360fe_TNV .bs-scan360 {
  max-width: 900px;
  margin: 24px auto;
  background: #FFFFFF;
  color: #1A2438;
  font-family: Calibri, Arial, sans-serif;
}
.360fe_TNV .bs-scan360__header {
  background: #1A3877;
  color: #FFFFFF;
  padding: 32px 40px 24px;
  position: relative;
}
.360fe_TNV .bs-scan360__header-eyebrow {
  font-size: 11px;
  letter-spacing: 3px;
  font-weight: 700;
  color: #C9A961;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.360fe_TNV .bs-scan360__header-title {
  font-size: 26px;
  font-weight: 700;
  margin: 0 0 4px;
  color: #FFFFFF;
}
.360fe_TNV .bs-scan360__header-meta {
  font-size: 13px;
  color: #B8C5DD;
  margin-top: 10px;
}
.360fe_TNV .bs-scan360__header-brand {
  position: absolute;
  top: 32px;
  right: 40px;
  font-size: 14px;
  font-weight: 700;
  color: #FFFFFF;
  letter-spacing: 0.5px;
}
.360fe_TNV .bs-scan360__body {
  padding: 32px 40px 40px;
}
.360fe_TNV .bs-scan360__section {
  margin-bottom: 32px;
}
.360fe_TNV .bs-scan360__section-label {
  font-size: 10px;
  letter-spacing: 4px;
  color: #5C6478;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.360fe_TNV .bs-scan360__section-title {
  font-size: 22px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 4px;
}
.360fe_TNV .bs-scan360__section-lead {
  font-size: 13px;
  color: #5C6478;
  font-style: italic;
  margin: 0 0 20px;
}
.360fe_TNV .bs-scan360__profile {
  background: #1A3877;
  color: #FFFFFF;
  padding: 28px 32px;
  margin-top: 8px;
}
.360fe_TNV .bs-scan360__profile-narrative {
  font-size: 14px;
  color: #EAEDF4;
  line-height: 1.55;
  margin: 20px 0 0;
}
.360fe_TNV .bs-scan360__profile-narrative strong {
  color: #FFFFFF;
  font-weight: 700;
}
.360fe_TNV .bs-scan360__bars {
  margin-top: 24px;
}
.360fe_TNV .bs-scan360__bar-group {
  margin-bottom: 14px;
}
.360fe_TNV .bs-scan360__bar-comp-label {
  font-size: 11.5px;
  font-weight: 700;
  color: #D5DEEB;
  margin-bottom: 4px;
}
.360fe_TNV .bs-scan360__bar-comp-label--priority {
  color: #C9A961;
}
.360fe_TNV .bs-scan360__bar-line {
  display: flex;
  align-items: center;
  margin-bottom: 3px;
  font-size: 11px;
}
.360fe_TNV .bs-scan360__bar-tag {
  width: 62px;
  color: #B8C5DD;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.360fe_TNV .bs-scan360__bar-track {
  flex: 1;
  height: 8px;
  background: rgba(255, 255, 255, 0.15);
  position: relative;
}
.360fe_TNV .bs-scan360__bar-fill--self {
  height: 8px;
  background: #C9A961;
}
.360fe_TNV .bs-scan360__bar-fill--other {
  height: 8px;
  background: #5F7CA8;
}
.360fe_TNV .bs-scan360__bar-value {
  width: 38px;
  text-align: right;
  color: #D5DEEB;
  font-size: 11px;
  margin-left: 10px;
  font-weight: 600;
}
.360fe_TNV .bs-scan360__archetype-compare {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 16px 0;
  margin: 20px -16px 0;
}
.360fe_TNV .bs-scan360__archetype-chip {
  display: table-cell;
  width: 50%;
  background: rgba(255, 255, 255, 0.08);
  padding: 14px 16px;
  vertical-align: top;
}
.360fe_TNV .bs-scan360__archetype-chip-label {
  font-size: 10px;
  letter-spacing: 2px;
  color: #C9A961;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.360fe_TNV .bs-scan360__archetype-chip-value {
  font-size: 16px;
  font-weight: 700;
  color: #FFFFFF;
}
.360fe_TNV .bs-scan360__archetype-chip-pct {
  font-size: 12px;
  color: #B8C5DD;
  margin-top: 2px;
}
.360fe_TNV .bs-scan360__two-col {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 20px 0;
  margin-left: -20px;
  margin-right: -20px;
}
.360fe_TNV .bs-scan360__col {
  display: table-cell;
  width: 50%;
  vertical-align: top;
}
.360fe_TNV .bs-scan360__card {
  background: #F5F7FA;
  padding: 20px 22px;
  border-top: 3px solid #1A3877;
}
.360fe_TNV .bs-scan360__card--gold {
  border-top-color: #C9A961;
}
.360fe_TNV .bs-scan360__item {
  margin-bottom: 16px;
}
.360fe_TNV .bs-scan360__item:last-child {
  margin-bottom: 0;
}
.360fe_TNV .bs-scan360__item-title {
  font-size: 14px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 4px;
}
.360fe_TNV .bs-scan360__item-body {
  font-size: 12.5px;
  color: #1A2438;
  margin: 0;
  line-height: 1.5;
}
.360fe_TNV .bs-scan360__item-scores {
  font-size: 11px;
  color: #5C6478;
  margin: 4px 0 0;
}
.360fe_TNV .bs-scan360__item-scores strong {
  color: #1A3877;
}
.360fe_TNV .bs-scan360__action {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px dashed #D5DEEB;
  font-size: 12px;
  color: #1A3877;
}
.360fe_TNV .bs-scan360__action-label {
  font-weight: 700;
  color: #C9A961;
  letter-spacing: 2px;
  font-size: 10px;
  text-transform: uppercase;
  margin-right: 6px;
}
.360fe_TNV .bs-scan360__gap-list {
  margin-top: 8px;
}
.360fe_TNV .bs-scan360__gap-row {
  display: flex;
  align-items: flex-start;
  padding: 14px 0;
  border-bottom: 1px solid #E8EDF4;
}
.360fe_TNV .bs-scan360__gap-row:last-child {
  border-bottom: none;
}
.360fe_TNV .bs-scan360__gap-comp {
  width: 190px;
  font-size: 13px;
  font-weight: 700;
  color: #1A3877;
  padding-right: 12px;
}
.360fe_TNV .bs-scan360__gap-body {
  flex: 1;
}
.360fe_TNV .bs-scan360__gap-scores {
  font-size: 11px;
  color: #5C6478;
  margin-bottom: 4px;
}
.360fe_TNV .bs-scan360__gap-text {
  font-size: 12.5px;
  color: #1A2438;
  line-height: 1.5;
  margin: 0;
}
.360fe_TNV .bs-scan360__badge {
  display: inline-block;
  padding: 3px 10px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #FFFFFF;
  margin-right: 8px;
}
.360fe_TNV .bs-scan360__badge--blindspot {
  background: #B2622E;
}
.360fe_TNV .bs-scan360__badge--hidden {
  background: #3E8074;
}
.360fe_TNV .bs-scan360__badge--aligned {
  background: #5C6478;
}
.360fe_TNV .bs-scan360__growth {
  margin-bottom: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid #E8EDF4;
}
.360fe_TNV .bs-scan360__growth:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.360fe_TNV .bs-scan360__growth-title {
  font-size: 15px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 12px;
  display: flex;
  align-items: baseline;
}
.360fe_TNV .bs-scan360__growth-number {
  color: #C9A961;
  font-weight: 700;
  margin-right: 10px;
  font-size: 18px;
}
.360fe_TNV .bs-scan360__growth-module {
  font-size: 11px;
  color: #5C6478;
  font-weight: 500;
  font-style: italic;
  margin-left: auto;
  letter-spacing: 1px;
}
.360fe_TNV .bs-scan360__growth-tag {
  font-size: 10px;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-weight: 700;
  margin-left: 10px;
  padding: 2px 8px;
  color: #FFFFFF;
}
.360fe_TNV .bs-scan360__growth-grid {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 10px 0;
  margin-left: -10px;
  margin-right: -10px;
}
.360fe_TNV .bs-scan360__growth-cell {
  display: table-cell;
  width: 25%;
  vertical-align: top;
}
.360fe_TNV .bs-scan360__growth-cell-label {
  font-size: 9px;
  letter-spacing: 3px;
  color: #C9A961;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.360fe_TNV .bs-scan360__growth-cell-body {
  font-size: 12px;
  color: #1A2438;
  line-height: 1.45;
}
.360fe_TNV .bs-scan360__timeline {
  position: relative;
  padding-left: 22px;
}
.360fe_TNV .bs-scan360__timeline-line {
  position: absolute;
  left: 6px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: #1A3877;
}
.360fe_TNV .bs-scan360__timeline-item {
  position: relative;
  margin-bottom: 22px;
}
.360fe_TNV .bs-scan360__timeline-item:last-child {
  margin-bottom: 0;
}
.360fe_TNV .bs-scan360__timeline-marker {
  position: absolute;
  left: -22px;
  top: 4px;
  width: 14px;
  height: 14px;
  background: #1A3877;
  border-radius: 50%;
  border: 3px solid #FFFFFF;
  box-shadow: 0 0 0 2px #1A3877;
}
.360fe_TNV .bs-scan360__timeline-marker--gold {
  background: #C9A961;
  box-shadow: 0 0 0 2px #C9A961;
}
.360fe_TNV .bs-scan360__timeline-horizon {
  font-size: 10px;
  letter-spacing: 3px;
  font-weight: 700;
  color: #C9A961;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.360fe_TNV .bs-scan360__timeline-headline {
  font-size: 15px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 8px;
}
.360fe_TNV .bs-scan360__timeline-list {
  margin: 0;
  padding-left: 0;
  list-style: none;
}
.360fe_TNV .bs-scan360__timeline-list li {
  font-size: 12.5px;
  color: #1A2438;
  line-height: 1.5;
  padding-left: 14px;
  position: relative;
  margin-bottom: 4px;
}
.360fe_TNV .bs-scan360__timeline-list li strong {
  color: #1A3877;
}
.360fe_TNV .bs-scan360__timeline-arrow {
  color: #C9A961;
  font-weight: 700;
  margin-right: 6px;
}
.360fe_TNV .bs-scan360__verbreding {
  background: #FAF6ED;
  padding: 20px 24px;
  border-left: 3px solid #C9A961;
}
.360fe_TNV .bs-scan360__verbreding-label {
  font-size: 10px;
  letter-spacing: 3px;
  color: #C9A961;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.360fe_TNV .bs-scan360__verbreding-title {
  font-size: 15px;
  font-weight: 700;
  color: #1A3877;
  margin: 0 0 6px;
}
.360fe_TNV .bs-scan360__verbreding-body {
  font-size: 13px;
  color: #1A2438;
  margin: 0;
  line-height: 1.5;
}
.360fe_TNV .bs-scan360__spider-wrap {
  text-align: center;
  margin: 16px 0 0;
}
.360fe_TNV .bs-scan360__spider-wrap img {
  max-width: 640px;
  width: 100%;
  height: auto;
}
.360fe_TNV .bs-scan360__spider-note {
  font-size: 11px;
  color: #5C6478;
  font-style: italic;
  margin-top: 8px;
}
.360fe_TNV .bs-scan360__scores-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 20px;
  font-size: 12px;
}
.360fe_TNV .bs-scan360__scores-table th {
  text-align: left;
  padding: 8px 10px;
  background: #F5F7FA;
  color: #5C6478;
  font-weight: 700;
  letter-spacing: 2px;
  font-size: 10px;
  text-transform: uppercase;
  border-bottom: 2px solid #E8EDF4;
}
.360fe_TNV .bs-scan360__scores-table td {
  padding: 8px 10px;
  border-bottom: 1px solid #E8EDF4;
  color: #1A2438;
}
.360fe_TNV .bs-scan360__scores-table td.bs-scan360__scores-comp {
  font-weight: 700;
  color: #1A3877;
}
.360fe_TNV .bs-scan360__scores-table td.bs-scan360__scores-bsm {
  color: #5C6478;
}
.360fe_TNV .bs-scan360__scores-table td.bs-scan360__scores-score {
  text-align: right;
  font-weight: 700;
  color: #1A3877;
}
.360fe_TNV .bs-scan360__scores-table td.bs-scan360__scores-gap {
  text-align: right;
  font-style: italic;
  color: #5C6478;
}
.360fe_TNV .bs-scan360__scores-note {
  font-size: 12px;
  color: #5C6478;
  font-style: italic;
  margin-top: 20px;
  line-height: 1.5;
}
.360fe_TNV .bs-scan360__footer {
  border-top: 1px solid #E8EDF4;
  padding: 20px 40px;
  font-size: 11px;
  color: #5C6478;
  display: flex;
  justify-content: space-between;
}
.360fe_TNV .bs-scan360__footer strong {
  color: #1A3877;
}
.360fe_TNV .bs-scan360__intro {
  margin: 0 0 16px;
  font-size: 13px;
  color: #5C6478;
  line-height: 1.6;
}
.360fe_TNV .bs-scan360__divider {
  border: 0;
  border-top: 1px solid #E8EDF4;
  margin: 32px 0;
}
.360fe_TNV .bs-scan360 .chart-wrapper {
  max-width: 900px;
  margin: 24px auto;
  background: #FFFFFF;
  color: #1A2438;
  font-family: Calibri, Arial, sans-serif;
  padding: 32px 40px 40px;
}
@media print {
  .360fe_TNV .bs-scan360__section {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__profile {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__card {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__gap-row {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__growth {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__timeline-item {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__verbreding {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__spider-wrap {
    page-break-inside: avoid;
  }
  .360fe_TNV .bs-scan360__scores-table {
    page-break-inside: avoid;
  }
}
.360fe_TNV .IsamBerenschotMaster .nopadding-form div.sd-body__page.sd-page {
  padding-left: 0 !important;
}
.360fe_TNV .IsamBerenschotMaster .nopadding-form div.sd-body.sd-body--static {
  margin-left: 0 !important;
}
.360fe_TNV .IsamBerenschotMaster .nopadding-form span .sv-string-viewer {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.test-kevin {
  --secondary--color-Name: #00ff00;
  --secondary--color-Name-rgb: ;
  --secondary--color-Name: #FFFF00;
  --secondary--color-Name-rgb: ;
  --neutral--color-50: #FFFFF0;
  --neutral--color-50-rgb: ;
}
.test-kevin .h1, .test-kevin h1, test-kevin .h1, test-kevin h1 {
  text-transform: none;
  font-size: 100px;
  line-height: 1.2;
  letter-spacing: 0.1px;
  font-family: Comic Sans MS;
}
.test-kevin .h2, .test-kevin h2, test-kevin .h2, test-kevin h2 {
  text-transform: none;
  font-size: 48px;
  line-height: 1.2;
}
.test-kevin .h3, .test-kevin h3, test-kevin .h3, test-kevin h3 {
  text-transform: none;
  font-size: 40px;
  line-height: 1.2;
  letter-spacing: 5px;
}
.test-kevin .h4, .test-kevin h4, test-kevin .h4, test-kevin h4 {
  text-transform: none;
  font-size: 32px;
  line-height: 1.2;
  letter-spacing: 5px;
}
.test-kevin .h5, .test-kevin h5, test-kevin .h5, test-kevin h5 {
  text-transform: none;
  font-size: 24px;
  line-height: 1.2;
  letter-spacing: 5px;
}
.test-kevin .h6, .test-kevin h6, test-kevin .h6, test-kevin h6 {
  text-transform: none;
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: 5px;
}
.test-kevin .p, .test-kevin p, test-kevin .p, test-kevin p {
  text-transform: none;
  font-size: 16px;
  line-height: 1.2;
  letter-spacing: 1px;
}
.Test Kevin .Button .button__Secondary {
  background-color: var(--secondary--color-Name);
  border-width: 0px;
  border-radius: 8px;
  font-size: 50px;
  padding-top: 16px;
  padding-right: 8px;
  padding-bottom: 16px;
  padding-left: 8px;
}
.test-kevin .BisbrickMasterDuplicate ._1c_intro_text .test h1 {
  color: red;
}

.bb-dashboard {
  --primary-color-1200: #0A7CFF;
  --primary-color-1200-rgb: 42,129,220;
  --primary-color-1000: #4499F2;
  --primary-color-1000-rgb: 68,153,242;
  --primary-color-800: #6CA7ED;
  --primary-color-800-rgb: 108,167,237;
  --primary-color-100: #F3F9FE;
  --primary-color-100-rgb: 243,249,254;
  --secondary-color-1000: #08213F;
  --secondary-color-1000-rgb: 8,33,63;
  --secondary-color-800: #354B66;
  --secondary-color-800-rgb: 53,75,102;
  --secondary-color-600: #728398;
  --secondary-color-600-rgb: 114,131,152;
  --secondary-color-400: #9FADBD;
  --secondary-color-400-rgb: 159,173,189;
  --secondary-color-200: #D3D9E1;
  --secondary-color-200-rgb: 211,217,225;
  --secondary-color-100: #ECF0F4;
  --secondary-color-100-rgb: 236,240,244;
  --secondary-color-50: #F7F9FA;
  --secondary-color-50-rgb: 247,249,250;
  --neutral-color-1000: #000000;
  --neutral-color-1000-rgb: 0,0,0;
  --neutral-color-800: #2C2C2C;
  --neutral-color-800-rgb: 44,44,44;
  --neutral-color-600: #70706F;
  --neutral-color-600-rgb: 112,112,111;
  --neutral-color-400: #BCBCBB;
  --neutral-color-400-rgb: 188,188,187;
  --neutral-color-200: #E0E0E0;
  --neutral-color-200-rgb: 224,224,224;
  --neutral-color-100: #E9E9EB;
  --neutral-color-100-rgb: 233,233,235;
  --neutral-color-50: #FAFAF9;
  --neutral-color-50-rgb: 250,250,249;
  --neutral-color-0: #FFFFFF;
  --neutral-color-0-rgb: 255,255,255;
  --positive-color: #32C77C;
  --positive-color-rgb: 50,199,124;
  --warning-color: #FEC84C;
  --warning-color-rgb: 254,200,76;
  --negative-color: #FF3131;
  --negative-color-rgb: 255,49,49;
  --button-padding: 0.5rem 2rem;
  --button-padding-rgb: ;
  --button-radius: 0.2rem;
  --button-radius-rgb: ;
  --input-radius: 0.2rem;
  --input-radius-rgb: ;
  --input-line-height: 3rem;
  --input-line-height-rgb: ;
  --font-content: Aeonik;
  --font-content-rgb: ;
  --font-heading: Gilroy;
  --font-heading-rgb: ;
  --font-link: Aeonik;
  --font-link-rgb: ;
  --font-size: 1rem;
  --font-size-rgb: ;
  --bg-color: #FFFFFF;
  --bg-color-rgb: 255,255,255;
  --other--color-Toolkit-Secondary: #fdf5ea;
  --other--color-Toolkit-Secondary-rgb: 253,245,234;
  --other--color-Toolkit-Primary: #F6F7F9;
  --other--color-Toolkit-Primary-rgb: 246,247,249;
}
.bb-dashboard .Button .button__Primary {
  background-color: var(--primary-color-1000);
  color: var(--neutral-color-0);
  border-width: 0;
  border-radius: 5px;
  font-size: 16px;
  padding-top: 9px;
  padding-right: 20px;
  padding-bottom: 9px;
  padding-left: 20px;
  font-family: Bisbrick-Regular;
}
.bb-dashboard .Button .button__Primary:hover {
  background-color: var(--secondary-color-200);
}
.bb-dashboard .Button .button__Secondary {
  background-color: var(--neutral-color-0);
  border-color: var(--primary-color-1200);
  color: var(--primary-color-1200);
  border-width: 2px;
  border-radius: 5px;
  font-size: 16px;
  padding-top: 8px;
  padding-right: 20px;
  padding-bottom: 8px;
  padding-left: 20px;
  font-family: Bisbrick-Regular;
}
.bb-dashboard .Button .button__Secondary:hover {
  background-color: var(--primary-color-100);
}
.bb-dashboard .Button .button__Toolkit_Primary {
  background-color: var(--other--color-Toolkit-Primary);
  color: var(--neutral-color-1000);
  border-width: 0px;
  border-radius: 5px;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  font-family: Bisbrick-Regular;
}
.bb-dashboard .Button .button__Toolkit_Primary:hover {
  background-color: var(--secondary-color-100);
  font-family: Bisbrick-Regular;
}
.bb-dashboard .Button .button__Toolkit_Secondary {
  background-color: var(--other--color-Toolkit-Secondary);
  color: var(--neutral-color-1000);
  border-width: 0px;
  border-radius: 5px;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  font-family: Bisbrick-Regular;
}
.bb-dashboard .Button .button__Toolkit_Secondary:hover {
  background-color: var(--secondary-color-100);
  font-family: Bisbrick-Regular;
}
.bb-dashboard .Button .button__Toolkit_Tertiary {
  background-color: var(--neutral-color-0);
  color: var(--neutral-color-1000);
  border-width: 0;
  border-radius: 5px;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  font-family: Bisbrick-Regular;
}
.bb-dashboard .Button .button__Toolkit_Tertiary:hover {
  background-color: var(--secondary-color-100);
  font-family: Bisbrick-Regular;
}
.bb-dashboard .Button .button__Toolkit_Add {
  background-color: var(--primary-color-100);
  color: var(--primary-color-1200);
  border-width: 0;
  border-radius: 5px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  font-family: Bisbrick-Regular;
}
.bb-dashboard .Button .button__Toolkit_Add:hover {
  background-color: var(--secondary-color-100);
  border-color: var(--neutral-color-0);
  border-width: 0;
  font-family: Bisbrick-Regular;
}
.bb-dashboard .dashboard-table table {
  width: 100%;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table td, .bb-dashboard .dashboard-table th {
  padding: 10px;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table th {
  background-color: #ffffff;
  color: #000000;
  text-align: left;
}
.bb-dashboard .dashboard-table tbody {
  border-bottom: 1px solid #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:hover {
  background-color: #F3F9FE !important;
}
.bb-dashboard .dashboard-table tbody tr:nth-of-type(odd) {
  background-color: #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:last-of-type {
  border-bottom: 2px solid #F6F7F9;
}
.bb-dashboard .dashboard-table table {
  width: 100%;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table td, .bb-dashboard .dashboard-table th {
  padding: 10px;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table th {
  background-color: #ffffff;
  color: #000000;
  text-align: left;
}
.bb-dashboard .dashboard-table tbody {
  border-bottom: 1px solid #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:hover {
  background-color: #F3F9FE !important;
}
.bb-dashboard .dashboard-table tbody tr:nth-of-type(odd) {
  background-color: #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:last-of-type {
  border-bottom: 2px solid #F6F7F9;
}
.bb-dashboard .hide-default-link a {
  text-decoration: none;
}
.bb-dashboard {
  --primary-color-1200: #2A81DC;
  --primary-color-1200-rgb: 42,129,220;
  --primary-color-1000: #4499F2;
  --primary-color-1000-rgb: 68,153,242;
  --primary-color-800: #6CA7ED;
  --primary-color-800-rgb: 108,167,237;
  --primary-color-100: #F3F9FE;
  --primary-color-100-rgb: 243,249,254;
  --secondary-color-1000: #08213F;
  --secondary-color-1000-rgb: 8,33,63;
  --secondary-color-800: #354B66;
  --secondary-color-800-rgb: 53,75,102;
  --secondary-color-600: #728398;
  --secondary-color-600-rgb: 114,131,152;
  --secondary-color-400: #9FADBD;
  --secondary-color-400-rgb: 159,173,189;
  --secondary-color-200: #D3D9E1;
  --secondary-color-200-rgb: 211,217,225;
  --secondary-color-100: #ECF0F4;
  --secondary-color-100-rgb: 236,240,244;
  --secondary-color-50: #F7F9FA;
  --secondary-color-50-rgb: 247,249,250;
  --neutral-color-1000: #000000;
  --neutral-color-1000-rgb: 0,0,0;
  --neutral-color-800: #2C2C2C;
  --neutral-color-800-rgb: 44,44,44;
  --neutral-color-600: #70706F;
  --neutral-color-600-rgb: 112,112,111;
  --neutral-color-400: #BCBCBB;
  --neutral-color-400-rgb: 188,188,187;
  --neutral-color-200: #E0E0E0;
  --neutral-color-200-rgb: 224,224,224;
  --neutral-color-100: #E9E9EB;
  --neutral-color-100-rgb: 233,233,235;
  --neutral-color-50: #FAFAF9;
  --neutral-color-50-rgb: 250,250,249;
  --neutral-color-0: #FFFFFF;
  --neutral-color-0-rgb: 255,255,255;
  --positive-color: #32C77C;
  --positive-color-rgb: 50,199,124;
  --warning-color: #FEC84C;
  --warning-color-rgb: 254,200,76;
  --negative-color: #FF3131;
  --negative-color-rgb: 255,49,49;
  --button-padding: 0.5rem 2rem;
  --button-padding-rgb: ;
  --button-radius: 0.2rem;
  --button-radius-rgb: ;
  --input-radius: 0.2rem;
  --input-radius-rgb: ;
  --input-line-height: 3rem;
  --input-line-height-rgb: ;
  --font-content: Aeonik;
  --font-content-rgb: ;
  --font-heading: Gilroy;
  --font-heading-rgb: ;
  --font-link: Aeonik;
  --font-link-rgb: ;
  --font-size: 1rem;
  --font-size-rgb: ;
  --bg-color: #FFFFFF;
  --bg-color-rgb: 255,255,255;
  --other--color-Toolkit-Secondary: #fdf5ea;
  --other--color-Toolkit-Secondary-rgb: 255,255,255;
  --other--color-Toolkit-Primary: #F6F7F9;
  --other--color-Toolkit-Primary-rgb: 246,247,249;
}
.bb-dashboard .Button .button__Primary {
  background-color: var(--primary-color-1000);
  color: var(--neutral-color-0);
  border-width: 0;
  border-radius: 5px;
  font-size: 16px;
  padding-top: 8px;
  padding-right: 20px;
  padding-bottom: 8px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Primary:hover {
  background-color: var(--secondary-color-200);
}
.bb-dashboard .Button .button__Secondary {
  background-color: var(--neutral-color-0);
  border-color: var(--primary-color-1200);
  color: var(--primary-color-1200);
  border-width: 2px;
  border-radius: 5px;
  font-size: 16px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Secondary:hover {
  background-color: var(--primary-color-100);
}
.bb-dashboard .Button .button__Toolkit_Primary {
  background-color: var(--other--color-Toolkit-Primary);
  color: var(--neutral-color-1000);
  border-width: 0px;
  border-radius: 5px;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Toolkit_Primary:hover {
  background-color: var(--secondary-color-200);
}
.bb-dashboard .Button .button__Toolkit_Secondary {
  background-color: var(--other--color-Toolkit-Secondary);
  color: var(--neutral-color-1000);
  border-width: 0px;
  border-radius: 5px;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Toolkit_Secondary:hover {
  background-color: var(--secondary-color-200);
}
.bb-dashboard .Button .button__Toolkit_Tertiary {
  background-color: var(--neutral-color-0);
  color: var(--neutral-color-1000);
  border-width: 0;
  border-radius: 5px;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Toolkit_Tertiary:hover {
  background-color: var(--secondary-color-200);
}
.bb-dashboard .Button .button__Toolkit_Add {
  background-color: var(--primary-color-100);
  color: var(--primary-color-1000);
  border-width: 0;
  border-radius: 5px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Toolkit_Add:hover {
  border-color: var(--primary-color-1000);
  border-width: 1px;
  padding-top: 9px;
  padding-right: 19px;
  padding-bottom: 9px;
  padding-left: 19px;
}
.bb-dashboard .dashboard-table table {
  width: 100%;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table td, .bb-dashboard .dashboard-table th {
  padding: 10px;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table th {
  background-color: #ffffff;
  color: #000000;
  text-align: left;
}
.bb-dashboard .dashboard-table tbody {
  border-bottom: 1px solid #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:hover {
  background-color: #F3F9FE !important;
}
.bb-dashboard .dashboard-table tbody tr:nth-of-type(odd) {
  background-color: #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:last-of-type {
  border-bottom: 2px solid #F6F7F9;
}
.bb-dashboard .dashboard-table table {
  width: 100%;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table td, .bb-dashboard .dashboard-table th {
  padding: 10px;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table th {
  background-color: #ffffff;
  color: #000000;
  text-align: left;
}
.bb-dashboard .dashboard-table tbody {
  border-bottom: 1px solid #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:hover {
  background-color: #F3F9FE !important;
}
.bb-dashboard .dashboard-table tbody tr:nth-of-type(odd) {
  background-color: #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:last-of-type {
  border-bottom: 2px solid #F6F7F9;
}
.bb-dashboard .hide-default-link a {
  text-decoration: none;
}
.bb-dashboard {
  --primary-color-1200: #2A81DC;
  --primary-color-1200-rgb: 42,129,220;
  --primary-color-1000: #4499F2;
  --primary-color-1000-rgb: 68,153,242;
  --primary-color-800: #6CA7ED;
  --primary-color-800-rgb: 108,167,237;
  --primary-color-100: #F3F9FE;
  --primary-color-100-rgb: 243,249,254;
  --secondary-color-1000: #08213F;
  --secondary-color-1000-rgb: 8,33,63;
  --secondary-color-800: #354B66;
  --secondary-color-800-rgb: 53,75,102;
  --secondary-color-600: #728398;
  --secondary-color-600-rgb: 114,131,152;
  --secondary-color-400: #9FADBD;
  --secondary-color-400-rgb: 159,173,189;
  --secondary-color-200: #D3D9E1;
  --secondary-color-200-rgb: 211,217,225;
  --secondary-color-100: #ECF0F4;
  --secondary-color-100-rgb: 236,240,244;
  --secondary-color-50: #F7F9FA;
  --secondary-color-50-rgb: 247,249,250;
  --neutral-color-1000: #000000;
  --neutral-color-1000-rgb: 0,0,0;
  --neutral-color-800: #2C2C2C;
  --neutral-color-800-rgb: 44,44,44;
  --neutral-color-600: #70706F;
  --neutral-color-600-rgb: 112,112,111;
  --neutral-color-400: #BCBCBB;
  --neutral-color-400-rgb: 188,188,187;
  --neutral-color-200: #E0E0E0;
  --neutral-color-200-rgb: 224,224,224;
  --neutral-color-100: #E9E9EB;
  --neutral-color-100-rgb: 233,233,235;
  --neutral-color-50: #FAFAF9;
  --neutral-color-50-rgb: 250,250,249;
  --neutral-color-0: #FFFFFF;
  --neutral-color-0-rgb: 255,255,255;
  --positive-color: #32C77C;
  --positive-color-rgb: 50,199,124;
  --warning-color: #FEC84C;
  --warning-color-rgb: 254,200,76;
  --negative-color: #FF3131;
  --negative-color-rgb: 255,49,49;
  --button-padding: 0.5rem 2rem;
  --button-padding-rgb: ;
  --button-radius: 0.2rem;
  --button-radius-rgb: ;
  --input-radius: 0.2rem;
  --input-radius-rgb: ;
  --input-line-height: 3rem;
  --input-line-height-rgb: ;
  --font-content: Aeonik;
  --font-content-rgb: ;
  --font-heading: Gilroy;
  --font-heading-rgb: ;
  --font-link: Aeonik;
  --font-link-rgb: ;
  --font-size: 1rem;
  --font-size-rgb: ;
  --bg-color: #FFFFFF;
  --bg-color-rgb: 255,255,255;
  --other--color-Toolkit-Secondary: #fdf5ea;
  --other--color-Toolkit-Secondary-rgb: 255,255,255;
  --other--color-Toolkit-Primary: #F6F7F9;
  --other--color-Toolkit-Primary-rgb: 246,247,249;
}
.bb-dashboard .Button .button__Primary {
  background-color: var(--primary-color-1000);
  color: var(--neutral-color-0);
  border-width: 0;
  border-radius: 5px;
  font-size: 16px;
  padding-top: 8px;
  padding-right: 20px;
  padding-bottom: 8px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Primary:hover {
  background-color: var(--secondary-color-200);
}
.bb-dashboard .Button .button__Secondary {
  background-color: var(--neutral-color-0);
  border-color: var(--primary-color-1200);
  color: var(--primary-color-1200);
  border-width: 2px;
  border-radius: 5px;
  font-size: 16px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Secondary:hover {
  background-color: var(--primary-color-100);
}
.bb-dashboard .Button .button__Toolkit_Primary {
  background-color: var(--other--color-Toolkit-Primary);
  color: var(--neutral-color-1000);
  border-width: 0px;
  border-radius: 5px;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Toolkit_Primary:hover {
  background-color: var(--secondary-color-200);
}
.bb-dashboard .Button .button__Toolkit_Secondary {
  background-color: var(--other--color-Toolkit-Secondary);
  color: var(--neutral-color-1000);
  border-width: 0px;
  border-radius: 5px;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Toolkit_Secondary:hover {
  background-color: var(--secondary-color-200);
}
.bb-dashboard .Button .button__Toolkit_Tertiary {
  background-color: var(--neutral-color-0);
  color: var(--neutral-color-1000);
  border-width: 0;
  border-radius: 5px;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Toolkit_Tertiary:hover {
  background-color: var(--secondary-color-200);
}
.bb-dashboard .Button .button__Toolkit_Add {
  background-color: var(--primary-color-100);
  color: var(--primary-color-1000);
  border-width: 0;
  border-radius: 5px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Toolkit_Add:hover {
  border-color: var(--primary-color-1000);
  border-width: 1px;
  padding-top: 9px;
  padding-right: 19px;
  padding-bottom: 9px;
  padding-left: 19px;
}
.bb-dashboard .dashboard-table table {
  width: 100%;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table td, .bb-dashboard .dashboard-table th {
  padding: 10px;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table th {
  background-color: #ffffff;
  color: #000000;
  text-align: left;
}
.bb-dashboard .dashboard-table tbody {
  border-bottom: 1px solid #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:hover {
  background-color: #F3F9FE !important;
}
.bb-dashboard .dashboard-table tbody tr:nth-of-type(odd) {
  background-color: #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:last-of-type {
  border-bottom: 2px solid #F6F7F9;
}
.bb-dashboard .dashboard-table table {
  width: 100%;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table td, .bb-dashboard .dashboard-table th {
  padding: 10px;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table th {
  background-color: #ffffff;
  color: #000000;
  text-align: left;
}
.bb-dashboard .dashboard-table tbody {
  border-bottom: 1px solid #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:hover {
  background-color: #F3F9FE !important;
}
.bb-dashboard .dashboard-table tbody tr:nth-of-type(odd) {
  background-color: #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:last-of-type {
  border-bottom: 2px solid #F6F7F9;
}
.bb-dashboard .hide-default-link a {
  text-decoration: none;
}
.bb-dashboard {
  --primary-color-1200: #2A81DC;
  --primary-color-1200-rgb: 42,129,220;
  --primary-color-1000: #4499F2;
  --primary-color-1000-rgb: 68,153,242;
  --primary-color-800: #6CA7ED;
  --primary-color-800-rgb: 108,167,237;
  --primary-color-100: #F3F9FE;
  --primary-color-100-rgb: 243,249,254;
  --secondary-color-1000: #08213F;
  --secondary-color-1000-rgb: 8,33,63;
  --secondary-color-800: #354B66;
  --secondary-color-800-rgb: 53,75,102;
  --secondary-color-600: #728398;
  --secondary-color-600-rgb: 114,131,152;
  --secondary-color-400: #9FADBD;
  --secondary-color-400-rgb: 159,173,189;
  --secondary-color-200: #D3D9E1;
  --secondary-color-200-rgb: 211,217,225;
  --secondary-color-100: #ECF0F4;
  --secondary-color-100-rgb: 236,240,244;
  --secondary-color-50: #F7F9FA;
  --secondary-color-50-rgb: 247,249,250;
  --neutral-color-1000: #000000;
  --neutral-color-1000-rgb: 0,0,0;
  --neutral-color-800: #2C2C2C;
  --neutral-color-800-rgb: 44,44,44;
  --neutral-color-600: #70706F;
  --neutral-color-600-rgb: 112,112,111;
  --neutral-color-400: #BCBCBB;
  --neutral-color-400-rgb: 188,188,187;
  --neutral-color-200: #E0E0E0;
  --neutral-color-200-rgb: 224,224,224;
  --neutral-color-100: #E9E9EB;
  --neutral-color-100-rgb: 233,233,235;
  --neutral-color-50: #FAFAF9;
  --neutral-color-50-rgb: 250,250,249;
  --neutral-color-0: #FFFFFF;
  --neutral-color-0-rgb: 255,255,255;
  --positive-color: #32C77C;
  --positive-color-rgb: 50,199,124;
  --warning-color: #FEC84C;
  --warning-color-rgb: 254,200,76;
  --negative-color: #FF3131;
  --negative-color-rgb: 255,49,49;
  --button-padding: 0.5rem 2rem;
  --button-padding-rgb: ;
  --button-radius: 0.2rem;
  --button-radius-rgb: ;
  --input-radius: 0.2rem;
  --input-radius-rgb: ;
  --input-line-height: 3rem;
  --input-line-height-rgb: ;
  --font-content: Aeonik;
  --font-content-rgb: ;
  --font-heading: Gilroy;
  --font-heading-rgb: ;
  --font-link: Aeonik;
  --font-link-rgb: ;
  --font-size: 1rem;
  --font-size-rgb: ;
  --bg-color: #FFFFFF;
  --bg-color-rgb: 255,255,255;
  --other--color-Toolkit-Secondary: #fdf5ea;
  --other--color-Toolkit-Secondary-rgb: 255,255,255;
  --other--color-Toolkit-Primary: #F6F7F9;
  --other--color-Toolkit-Primary-rgb: 246,247,249;
}
.bb-dashboard .Button .button__Primary {
  background-color: var(--primary-color-1000);
  color: var(--neutral-color-0);
  border-width: 0;
  border-radius: 5px;
  font-size: 16px;
  padding-top: 8px;
  padding-right: 20px;
  padding-bottom: 8px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Primary:hover {
  background-color: var(--secondary-color-200);
}
.bb-dashboard .Button .button__Secondary {
  background-color: var(--neutral-color-0);
  border-color: var(--primary-color-1200);
  color: var(--primary-color-1200);
  border-width: 2px;
  border-radius: 5px;
  font-size: 16px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Secondary:hover {
  background-color: var(--primary-color-100);
}
.bb-dashboard .Button .button__Toolkit_Primary {
  background-color: var(--other--color-Toolkit-Primary);
  color: var(--neutral-color-1000);
  border-width: 0px;
  border-radius: 5px;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Toolkit_Primary:hover {
  background-color: var(--secondary-color-200);
}
.bb-dashboard .Button .button__Toolkit_Secondary {
  background-color: var(--other--color-Toolkit-Secondary);
  color: var(--neutral-color-1000);
  border-width: 0px;
  border-radius: 5px;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Toolkit_Secondary:hover {
  background-color: var(--secondary-color-200);
}
.bb-dashboard .Button .button__Toolkit_Tertiary {
  background-color: var(--neutral-color-0);
  color: var(--neutral-color-1000);
  border-width: 0;
  border-radius: 5px;
  font-size: 14px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Toolkit_Tertiary:hover {
  background-color: var(--secondary-color-200);
}
.bb-dashboard .Button .button__Toolkit_Add {
  background-color: var(--primary-color-100);
  color: var(--primary-color-1000);
  border-width: 0;
  border-radius: 5px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
.bb-dashboard .Button .button__Toolkit_Add:hover {
  border-color: var(--primary-color-1000);
  border-width: 1px;
  padding-top: 9px;
  padding-right: 19px;
  padding-bottom: 9px;
  padding-left: 19px;
}
.bb-dashboard .dashboard-table table {
  width: 100%;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table td, .bb-dashboard .dashboard-table th {
  padding: 10px;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table th {
  background-color: #ffffff;
  color: #000000;
  text-align: left;
}
.bb-dashboard .dashboard-table tbody {
  border-bottom: 1px solid #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:hover {
  background-color: #F3F9FE !important;
}
.bb-dashboard .dashboard-table tbody tr:nth-of-type(odd) {
  background-color: #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:last-of-type {
  border-bottom: 2px solid #F6F7F9;
}
.bb-dashboard .hide-default-link a {
  text-decoration: none;
}
.bb-dashboard .dashboard-table table {
  width: 100%;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table td, .bb-dashboard .dashboard-table th {
  padding: 10px;
  border: 0px solid #ffffff;
}
.bb-dashboard .dashboard-table th {
  background-color: #ffffff;
  color: #000000;
  text-align: left;
}
.bb-dashboard .dashboard-table tbody {
  border-bottom: 1px solid #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:hover {
  background-color: #F3F9FE !important;
}
.bb-dashboard .dashboard-table tbody tr:nth-of-type(odd) {
  background-color: #F6F7F9;
}
.bb-dashboard .dashboard-table tbody tr:last-of-type {
  border-bottom: 2px solid #F6F7F9;
}
.bisbricknew {
  --primary-1: #6553e7;
  --primary-1-rgb: 101,83,231;
}
.bisbricknew .h1, .bisbricknew h1, bisbricknew .h1, bisbricknew h1 {
  font-family: Arial Black;
  text-transform: none;
  font-size: 40px;
}
.bisbricknew .h2, .bisbricknew h2, bisbricknew .h2, bisbricknew h2 {
  font-family: Arial Black;
  text-transform: none;
  font-size: 25px;
}
@charset "UTF-8";
.bisbricknew {
  /* ============================================================
  MHC Mobility — 360° Feedback rapport
  Styling voor AI-gegenereerde individuele rapporten
  Werkt samen met mhc_360_systemprompt.md
  ============================================================ */
  /* ---------- 1. Design tokens (scoped to .mhc-360) ---------- */
  /* ---------- 2. Reset & base ---------- */
  /* Demo-only body styling — niet onderdeel van het component zelf.
     In Bisbrick (of een andere host) wordt deze regel niet gebruikt;
     het component zelf is volledig zelf-bevattend onder .mhc-360. */
  /* ---------- 3. Component root + headings (alles onder .mhc-360) ---------- */
  /* ---------- 4. Header ---------- */
  /* Section markers — big amber numerals before each section title */
  /* Stats strip — hero KPI tiles in section 1 */
  /* Reasons panel — Wat zou de reden kunnen zijn? */
  /* ---------- 5. Sectie 1: Overzicht ---------- */
  /* Spider chart container */
  /* Key findings */
  /* ---------- 6. Sectie 2: Verdieping ---------- */
  /* Score pills */
  /* Rode draad */
  /* ---------- 7. Sectie 3: Details ---------- */
  /* Filter mhc-360__bar */
  /* Detail tables */
  /* Filter — driestand via data-attribuut op .mhc-360__details */
  /* Niveau-tags */
  /* Delta */
  /* ---------- 8. Bar charts per vraag (sectie 3) ---------- */
  /* Axis mhc-360__bar across the top — D B E L labels aligned with mhc-360__bar zones */
  /* Per-question block */
  /* Question header: scenario text + delta badge */
  /* Bar rows wrapper */
  /* Single mhc-360__bar row: source label + track */
  /* Bar track — background with subtle level zones */
  /* Target line — vertical marker */
  /* The actual mhc-360__bar — fills from left to its mhc-360__score */
  /* Score value label — sits directly after the mhc-360__bar's end */
  /* "Niet geobserveerd" state — striped mhc-360__bar instead of solid */
  /* Filter hides rows based on selection */
  /* Legend below charts */
  /* Toggle to show exact mhc-360__tag table below dumbbell */
  /* ---------- 9. Footer ---------- */
  /* ---------- 10. Responsive ---------- */
  /* ---------- 11. Print ---------- */
  /* ════════════════════════════════════════════════════════════════════════
     12. SECTION ICONS — CSS-only, SVG via data URI
     Icons sit before the h2 text in each section-marker. The agent adds
     a single class to the h2 (e.g. mhc-360__ico--overview); no extra
     HTML element, no inline SVG, no LLM geometry.
     ════════════════════════════════════════════════════════════════════════ */
  /* ════════════════════════════════════════════════════════════════════════
     13. TREND MOTIF — subtle upward trend line on "good" stat tiles
     Decorative only, drawn via ::after on .mhc-360__stat--good. No JS,
     no inline SVG in the HTML.
     ════════════════════════════════════════════════════════════════════════ */
  /* Attention-tile gets a subtle "spread/gap" motif instead — two diverging lines */
  /* ════════════════════════════════════════════════════════════════════════
     14. HOST-PROOFING — force every text color with !important + doubled
     root selector specificity. Wins cascade against host stylesheets that
     set global text colors on p / li / td via :root, body, or class rules
     loaded after this sheet. The earlier inheritance-based colors lose
     the cascade in some embed contexts; these rules win it outright.
     ════════════════════════════════════════════════════════════════════════ */
  /* Dark body text on light surfaces */
  /* Section + body headings — navy */
  /* Eyebrow + amber accent labels */
  /* WHITE text on dark surfaces — forced so host cannot darken */
  /* Eyebrow stays amber */
  /* Score pill colors */
  /* Tag colors keep their semantic foreground */
  /* Delta semantic colors */
  /* Bar value labels keep their accent */
  /* nested strong follows parent's forced color */
}
.bisbricknew .mhc-360 {
  /* Brand kleuren */
  --navy: #1F3A5F;
  --navy-soft: #2C4F7B;
  --amber: #C9A352;
  --amber-warm: #E29F47;
  /* Data-serie kleuren */
  --self: #2E9CCA;
  /* zelfreflectie — cyan */
  --self-bg: rgba(46, 156, 202, 0.12);
  --self-border: rgba(46, 156, 202, 0.45);
  --manager: #E29F47;
  /* manager — warm amber */
  --manager-bg: rgba(226, 159, 71, 0.12);
  --manager-border: rgba(226, 159, 71, 0.45);
  --target: #555555;
  /* target — neutraal grijs (dotted in chart) */
  --ambition: #6FAE83;
  /* ambitie — sage groen (dashed in chart) */
  /* Niveau-tags (D / B / E / L) */
  --tag-D-bg: #E8F2F9;
  --tag-D-fg: #1F567F;
  --tag-B-bg: #FAE9D4;
  --tag-B-fg: #8A5A1F;
  --tag-E-bg: #DCEDE0;
  --tag-E-fg: #2A6D45;
  --tag-L-bg: #E8DEF2;
  --tag-L-fg: #4E3878;
  --tag-NO-bg: #ECEEF1;
  --tag-NO-fg: #6C757D;
  /* Delta */
  --delta-positive: #2A6D45;
  --delta-negative: #B23A48;
  --delta-zero: #6C757D;
  /* Surface */
  --bg: #FBFAF7;
  --surface: #FFFFFF;
  --surface-soft: #F4F1EA;
  --border: #E5E7EB;
  --border-soft: #EFEDE8;
  /* Tekst */
  --text: #1F2937;
  --text-soft: #4B5563;
  --text-mute: #6B7280;
  /* Type & layout */
  --font: "Helvetica Neue", "Arial", system-ui, -apple-system, sans-serif;
  --radius: 8px;
  --radius-lg: 12px;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}
.bisbricknew *, .bisbricknew *::before, .bisbricknew *::after {
  box-sizing: border-box;
}
.bisbricknew html {
  -webkit-text-size-adjust: 100%;
}
.bisbricknew body {
  margin: 0;
  padding: 40px 20px 80px;
  font-family: "Helvetica Neue", "Arial", system-ui, -apple-system, sans-serif;
  font-size: 15px;
  line-height: 1.55;
  color: #1F2937;
  background: #FBFAF7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.bisbricknew .mhc-360 {
  max-width: 880px;
  margin: 0 auto;
  background: var(--surface);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  overflow: hidden;
  font-family: var(--font);
  font-size: 15px;
  line-height: 1.55;
  color: var(--text);
}
.bisbricknew .mhc-360 h1,
.bisbricknew .mhc-360 h2,
.bisbricknew .mhc-360 h3,
.bisbricknew .mhc-360 h4 {
  margin: 0;
  font-weight: 600;
  color: var(--navy);
  line-height: 1.25;
}
.bisbricknew .mhc-360 p {
  margin: 0 0 0.9em;
}
.bisbricknew .mhc-360 ul {
  margin: 0 0 0.9em;
  padding-left: 1.4em;
}
.bisbricknew .mhc-360 li {
  margin-bottom: 0.5em;
}
.bisbricknew .mhc-360__header {
  padding: 48px 48px 36px;
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-soft) 100%);
  color: #fff;
  position: relative;
  overflow: hidden;
}
.bisbricknew .mhc-360__header::before {
  content: "";
  position: absolute;
  top: -40px;
  right: -40px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(201, 163, 82, 0.18) 0%, transparent 70%);
  pointer-events: none;
}
.bisbricknew .mhc-360__header .mhc-360__eyebrow {
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--amber);
  margin: 0 0 12px;
  font-weight: 600;
  position: relative;
}
.bisbricknew .mhc-360__header h1 {
  font-size: 32px;
  color: #fff;
  margin: 0 0 12px;
  letter-spacing: -0.01em;
  position: relative;
}
.bisbricknew .mhc-360__header .mhc-360__meta {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.78);
  margin: 0;
  font-style: italic;
  position: relative;
}
.bisbricknew .mhc-360__section-marker {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 0 28px;
}
.bisbricknew .mhc-360__section-num {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
  height: 44px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--amber) 0%, var(--amber-warm) 100%);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.02em;
  box-shadow: 0 2px 8px rgba(201, 163, 82, 0.3);
}
.bisbricknew .mhc-360__section-marker h2 {
  margin: 0;
  font-size: 22px;
  padding-bottom: 0;
  border-bottom: none;
}
.bisbricknew .mhc-360__stats {
  display: flex;
  gap: 12px;
  margin: 0 0 32px;
}
.bisbricknew .mhc-360__stat {
  flex: 1 1 0;
  min-width: 0;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px 16px 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  position: relative;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.bisbricknew .mhc-360__stat:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-sm);
}
.bisbricknew .mhc-360__stat .mhc-360__stat-label {
  font-size: 10.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-mute);
  font-weight: 600;
  margin-bottom: 4px;
}
.bisbricknew .mhc-360__stat .mhc-360__stat-value {
  font-size: 22px;
  font-weight: 700;
  color: var(--navy);
  line-height: 1.1;
  letter-spacing: -0.01em;
}
.bisbricknew .mhc-360__stat .mhc-360__stat-value.mhc-360__stat-value--text {
  font-size: 17px;
}
.bisbricknew .mhc-360__stat .mhc-360__stat-of {
  font-size: 16px;
  color: var(--text-mute);
  font-weight: 500;
}
.bisbricknew .mhc-360__stat .mhc-360__stat-sub {
  font-size: 12px;
  color: var(--text-soft);
  margin-top: auto;
  padding-top: 4px;
}
.bisbricknew .mhc-360__stat.mhc-360__stat--attention {
  border-color: var(--manager-border);
  background: linear-gradient(135deg, var(--manager-bg) 0%, var(--surface) 60%);
}
.bisbricknew .mhc-360__stat.mhc-360__stat--attention .mhc-360__stat-value {
  color: #946D24;
}
.bisbricknew .mhc-360__stat.mhc-360__stat--good {
  border-color: rgba(111, 174, 131, 0.4);
  background: linear-gradient(135deg, rgba(111, 174, 131, 0.1) 0%, var(--surface) 60%);
}
.bisbricknew .mhc-360__stat.mhc-360__stat--good .mhc-360__stat-value {
  color: #2A6D45;
}
.bisbricknew .mhc-360__reasons {
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 28px 30px 24px;
  margin-top: 24px;
  page-break-inside: avoid;
  break-inside: avoid;
}
.bisbricknew .mhc-360__reasons > h3 {
  font-size: 18px;
  margin: 0 0 8px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.bisbricknew .mhc-360__reasons > h3::before {
  content: "?";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--amber);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  flex-shrink: 0;
}
.bisbricknew .mhc-360__reasons-intro {
  color: var(--text-soft);
  font-size: 13.5px;
  margin: 0 0 22px;
  padding-left: 40px;
}
.bisbricknew .mhc-360__reasons-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
.bisbricknew .mhc-360__reason {
  flex: 1 1 calc(50% - 8px);
  min-width: 260px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px 20px 14px;
  position: relative;
}
.bisbricknew .mhc-360__reason .mhc-360__reason-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 10px;
}
.bisbricknew .mhc-360__reason.mhc-360__reason--self-high .mhc-360__reason-icon {
  background: var(--self-bg);
  color: var(--self);
}
.bisbricknew .mhc-360__reason.mhc-360__reason--manager-high .mhc-360__reason-icon {
  background: var(--manager-bg);
  color: var(--manager);
}
.bisbricknew .mhc-360__reason.mhc-360__reason--aligned-below .mhc-360__reason-icon {
  background: rgba(178, 58, 72, 0.1);
  color: var(--delta-negative);
}
.bisbricknew .mhc-360__reason.mhc-360__reason--aligned-ok .mhc-360__reason-icon {
  background: rgba(42, 109, 69, 0.1);
  color: var(--delta-positive);
}
.bisbricknew .mhc-360__reason h4 {
  font-size: 14px;
  color: var(--navy);
  margin: 0 0 10px;
  font-weight: 600;
  line-height: 1.35;
}
.bisbricknew .mhc-360__reason ul {
  margin: 0;
  padding-left: 18px;
  font-size: 13px;
  color: var(--text);
  line-height: 1.5;
}
.bisbricknew .mhc-360__reason li {
  margin-bottom: 6px;
}
.bisbricknew .mhc-360__reason li:last-child {
  margin-bottom: 0;
}
.bisbricknew .mhc-360__reason li::marker {
  color: var(--amber);
}
.bisbricknew .mhc-360__overview {
  padding: 40px 48px;
  border-bottom: 1px solid var(--border);
}
.bisbricknew .mhc-360__overview h2 {
  font-size: 22px;
  margin: 0 0 24px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--amber);
  display: inline-block;
}
.bisbricknew .mhc-360__chart-wrap {
  position: relative;
  height: 460px;
  margin: 0 0 36px;
  padding: 16px 8px 8px;
  background: var(--surface-soft);
  border-radius: var(--radius);
}
.bisbricknew .mhc-360__findings {
  background: var(--surface-soft);
  border-left: 4px solid var(--amber);
  padding: 20px 24px 16px;
  border-radius: 0 var(--radius) var(--radius) 0;
}
.bisbricknew .mhc-360__findings h3 {
  font-size: 14px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--amber-warm);
  margin: 0 0 12px;
  font-weight: 700;
}
.bisbricknew .mhc-360__findings ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}
.bisbricknew .mhc-360__findings li {
  position: relative;
  padding-left: 22px;
  margin-bottom: 10px;
  color: var(--text);
  line-height: 1.55;
}
.bisbricknew .mhc-360__findings li:last-child {
  margin-bottom: 0;
}
.bisbricknew .mhc-360__findings li::before {
  content: "▸";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--amber);
  font-weight: bold;
}
.bisbricknew .mhc-360__deep-dive {
  padding: 40px 48px;
  border-bottom: 1px solid var(--border);
}
.bisbricknew .mhc-360__deep-dive > h2:first-child {
  font-size: 22px;
  margin: 0 0 28px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--amber);
  display: inline-block;
}
.bisbricknew .mhc-360__comp {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 22px 24px;
  margin-bottom: 18px;
  page-break-inside: avoid;
  break-inside: avoid;
}
.bisbricknew .mhc-360__comp header {
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px dashed var(--border-soft);
}
.bisbricknew .mhc-360__comp header h3 {
  font-size: 17px;
  margin: 0 0 10px;
}
.bisbricknew .mhc-360__scores {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.bisbricknew .mhc-360__score {
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 999px;
  white-space: nowrap;
}
.bisbricknew .mhc-360__score--self {
  background: var(--self-bg);
  color: #14618A;
  border: 1px solid var(--self-border);
}
.bisbricknew .mhc-360__score--manager {
  background: var(--manager-bg);
  color: #8A5A1F;
  border: 1px solid var(--manager-border);
}
.bisbricknew .mhc-360__score--target {
  background: transparent;
  color: var(--text-soft);
  border: 1px dashed #B5B5B5;
}
.bisbricknew .mhc-360__score--ambition {
  background: transparent;
  color: var(--ambition);
  border: 1px dotted var(--ambition);
}
.bisbricknew .mhc-360__comp .mhc-360__observation {
  color: var(--text);
  margin-bottom: 12px;
}
.bisbricknew .mhc-360__comp .mhc-360__recommendation {
  background: var(--surface-soft);
  border-left: 3px solid var(--amber);
  padding: 12px 16px;
  border-radius: 0 var(--radius) var(--radius) 0;
  margin: 0;
  font-size: 14.5px;
  color: var(--text);
}
.bisbricknew .mhc-360__comp .mhc-360__recommendation::before {
  content: "Volgende stap";
  display: block;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--amber-warm);
  font-weight: 700;
  margin-bottom: 4px;
}
.bisbricknew .mhc-360__overall {
  background: var(--navy);
  color: #fff;
  border-radius: var(--radius);
  padding: 24px 28px;
  margin-top: 24px;
  page-break-inside: avoid;
  break-inside: avoid;
}
.bisbricknew .mhc-360__overall h3 {
  color: #fff;
  font-size: 17px;
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--amber);
  display: inline-block;
}
.bisbricknew .mhc-360__overall p {
  margin: 0;
  color: rgba(255, 255, 255, 0.92);
  font-size: 15px;
  line-height: 1.6;
}
.bisbricknew .mhc-360__details {
  padding: 40px 48px;
}
.bisbricknew .mhc-360__details > h2 {
  font-size: 22px;
  margin: 0 0 12px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--amber);
  display: inline-block;
}
.bisbricknew .mhc-360__details-intro {
  color: var(--text-soft);
  font-size: 14px;
  margin: 0 0 24px;
}
.bisbricknew .mhc-360__filter-bar {
  display: inline-flex;
  background: var(--surface-soft);
  border-radius: var(--radius);
  padding: 4px;
  margin-bottom: 28px;
  gap: 0;
}
.bisbricknew .mhc-360__filter-btn {
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  padding: 8px 16px;
  border: none;
  background: transparent;
  color: var(--text-soft);
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.15s ease;
}
.bisbricknew .mhc-360__filter-btn:hover {
  color: var(--navy);
}
.bisbricknew .mhc-360__filter-btn.is-active {
  background: var(--navy);
  color: #fff;
  box-shadow: var(--shadow-sm);
}
.bisbricknew .mhc-360__filter-btn:focus-visible {
  outline: 2px solid var(--amber);
  outline-offset: 2px;
}
.bisbricknew .mhc-360__comp-detail {
  margin-bottom: 28px;
  page-break-inside: avoid;
  break-inside: avoid;
}
.bisbricknew .mhc-360__comp-detail h3 {
  font-size: 15px;
  margin: 0 0 10px;
  color: var(--navy);
  font-weight: 600;
}
.bisbricknew .mhc-360__detail-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  font-size: 13.5px;
}
.bisbricknew .mhc-360__detail-table thead {
  background: var(--surface-soft);
}
.bisbricknew .mhc-360__detail-table th {
  text-align: left;
  padding: 10px 14px;
  font-weight: 600;
  color: var(--navy);
  font-size: 12px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--border);
}
.bisbricknew .mhc-360__detail-table td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--border-soft);
  vertical-align: middle;
}
.bisbricknew .mhc-360__detail-table tr:last-child td {
  border-bottom: none;
}
.bisbricknew .mhc-360__detail-table tbody tr:hover {
  background: var(--surface-soft);
}
.bisbricknew .mhc-360__detail-table .mhc-360__col--question {
  width: 42%;
  color: var(--text);
}
.bisbricknew .mhc-360__detail-table .mhc-360__col--self,
.bisbricknew .mhc-360__detail-table .mhc-360__col--manager {
  width: 22%;
  text-align: center;
}
.bisbricknew .mhc-360__detail-table .mhc-360__col--delta {
  width: 14%;
  text-align: center;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.bisbricknew .mhc-360__detail-table th.mhc-360__col--self,
.bisbricknew .mhc-360__detail-table td.mhc-360__col--self {
  background: rgba(46, 156, 202, 0.04);
}
.bisbricknew .mhc-360__detail-table th.mhc-360__col--manager,
.bisbricknew .mhc-360__detail-table td.mhc-360__col--manager {
  background: rgba(226, 159, 71, 0.04);
}
.bisbricknew .mhc-360__details[data-filter=self] .mhc-360__col--manager,
.bisbricknew .mhc-360__details[data-filter=self] .mhc-360__col--delta {
  display: none;
}
.bisbricknew .mhc-360__details[data-filter=manager] .mhc-360__col--self,
.bisbricknew .mhc-360__details[data-filter=manager] .mhc-360__col--delta {
  display: none;
}
.bisbricknew .mhc-360__tag {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.4;
  white-space: nowrap;
}
.bisbricknew .mhc-360__tag--D {
  background: var(--tag-D-bg);
  color: var(--tag-D-fg);
}
.bisbricknew .mhc-360__tag--B {
  background: var(--tag-B-bg);
  color: var(--tag-B-fg);
}
.bisbricknew .mhc-360__tag--E {
  background: var(--tag-E-bg);
  color: var(--tag-E-fg);
}
.bisbricknew .mhc-360__tag--L {
  background: var(--tag-L-bg);
  color: var(--tag-L-fg);
}
.bisbricknew .mhc-360__tag--NO {
  background: var(--tag-NO-bg);
  color: var(--tag-NO-fg);
  font-style: italic;
  font-weight: 500;
}
.bisbricknew .mhc-360__delta--positive {
  color: var(--delta-positive);
}
.bisbricknew .mhc-360__delta--negative {
  color: var(--delta-negative);
}
.bisbricknew .mhc-360__delta--zero {
  color: var(--delta-zero);
}
.bisbricknew .mhc-360__bar-chart {
  background: var(--surface-soft);
  border-radius: var(--radius);
  padding: 22px 22px 20px;
  margin: 12px 0 18px;
}
.bisbricknew .mhc-360__axis {
  display: flex;
  margin-bottom: 14px;
  padding-left: 82px;
  /* matches .mhc-360__bar-source width + gap */
  padding-right: 70px;
  /* leaves room for the value labels at end of bars */
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--text-mute);
  border-bottom: 1px dashed var(--border);
  padding-bottom: 8px;
}
.bisbricknew .mhc-360__axis .mhc-360__axis-label {
  flex: 1 1 0;
  text-align: center;
  position: relative;
}
.bisbricknew .mhc-360__question {
  margin-bottom: 22px;
  padding-bottom: 18px;
  border-bottom: 1px dashed var(--border);
}
.bisbricknew .mhc-360__question:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}
.bisbricknew .mhc-360__q-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}
.bisbricknew .mhc-360__q-label {
  flex: 1 1 auto;
  font-size: 13px;
  color: var(--text);
  font-weight: 500;
  line-height: 1.35;
}
.bisbricknew .mhc-360__q-delta {
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
  font-variant-numeric: tabular-nums;
  padding: 3px 12px;
  border-radius: 999px;
  background: var(--surface);
  border: 1px solid var(--border);
  min-width: 44px;
}
.bisbricknew .mhc-360__q-delta.mhc-360__delta--positive {
  color: var(--delta-positive);
  border-color: rgba(42, 109, 69, 0.3);
}
.bisbricknew .mhc-360__q-delta.mhc-360__delta--negative {
  color: var(--delta-negative);
  border-color: rgba(178, 58, 72, 0.3);
}
.bisbricknew .mhc-360__q-delta.mhc-360__delta--zero {
  color: var(--text-mute);
  font-weight: 500;
}
.bisbricknew .mhc-360__q-delta.mhc-360__delta--NO {
  color: var(--text-mute);
  font-style: italic;
  font-weight: 500;
}
.bisbricknew .mhc-360__bar-rows {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.bisbricknew .mhc-360__bar-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.bisbricknew .mhc-360__bar-source {
  flex: 0 0 72px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-soft);
}
.bisbricknew .mhc-360__bar-row.mhc-360__bar-row--self .mhc-360__bar-source {
  color: #14618A;
}
.bisbricknew .mhc-360__bar-row.mhc-360__bar-row--manager .mhc-360__bar-source {
  color: #8A5A1F;
}
.bisbricknew .mhc-360__bar-track {
  flex: 1 1 auto;
  position: relative;
  height: 22px;
  background: linear-gradient(to right, var(--tag-D-bg) 0%, var(--tag-D-bg) 25%, var(--tag-B-bg) 25%, var(--tag-B-bg) 50%, var(--tag-E-bg) 50%, var(--tag-E-bg) 75%, var(--tag-L-bg) 75%, var(--tag-L-bg) 100%);
  border-radius: 4px;
  opacity: 0.95;
  margin-right: 60px;
  /* room for value label */
}
.bisbricknew .mhc-360__bar-track::after {
  /* faint zone divider lines */
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, transparent 0, transparent calc(25% - 1px), rgba(255, 255, 255, 0.6) calc(25% - 1px), rgba(255, 255, 255, 0.6) 25%, transparent 25%, transparent calc(50% - 1px), rgba(255, 255, 255, 0.6) calc(50% - 1px), rgba(255, 255, 255, 0.6) 50%, transparent 50%, transparent calc(75% - 1px), rgba(255, 255, 255, 0.6) calc(75% - 1px), rgba(255, 255, 255, 0.6) 75%, transparent 75%);
  pointer-events: none;
  border-radius: 4px;
}
.bisbricknew .mhc-360__target-line {
  position: absolute;
  top: -3px;
  bottom: -3px;
  width: 2px;
  background: var(--target);
  /* Map mhc-360__score 1→25%, 2→50%, 3→75%, 4→100% */
  left: calc(var(--score) / 4 * 100%);
  border-radius: 1px;
  opacity: 0.65;
  transform: translateX(-50%);
  z-index: 1;
}
.bisbricknew .mhc-360__target-line::before {
  content: "▼";
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 8px;
  color: var(--target);
  opacity: 0.7;
}
.bisbricknew .mhc-360__bar {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: calc(var(--score) / 4 * 100%);
  border-radius: 4px;
  z-index: 2;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  transition: width 0.4s ease;
  overflow: visible;
}
.bisbricknew .mhc-360__bar--self {
  background: linear-gradient(to right, var(--self) 0%, #45B0DC 100%);
  color: #fff;
}
.bisbricknew .mhc-360__bar--manager {
  background: linear-gradient(to right, var(--manager) 0%, #EFB264 100%);
  color: #fff;
}
.bisbricknew .mhc-360__bar-value {
  position: absolute;
  left: calc(100% + 8px);
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.bisbricknew .mhc-360__bar--self .mhc-360__bar-value {
  color: #14618A;
}
.bisbricknew .mhc-360__bar--manager .mhc-360__bar-value {
  color: #8A5A1F;
}
.bisbricknew .mhc-360__bar-track.mhc-360__bar-track--no .mhc-360__bar-no-label {
  position: absolute;
  top: 50%;
  left: 12px;
  transform: translateY(-50%);
  font-size: 11px;
  font-style: italic;
  color: var(--text-mute);
  z-index: 2;
}
.bisbricknew .mhc-360__bar-track.mhc-360__bar-track--no::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(-45deg, transparent, transparent 6px, rgba(108, 117, 125, 0.12) 6px, rgba(108, 117, 125, 0.12) 12px);
  border-radius: 4px;
  z-index: 1;
}
.bisbricknew .mhc-360__details[data-filter=self] .mhc-360__bar-row--manager,
.bisbricknew .mhc-360__details[data-filter=self] .mhc-360__q-delta,
.bisbricknew .mhc-360__details[data-filter=manager] .mhc-360__bar-row--self,
.bisbricknew .mhc-360__details[data-filter=manager] .mhc-360__q-delta {
  display: none;
}
.bisbricknew .mhc-360__legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 14px 20px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-size: 12.5px;
  color: var(--text-soft);
  margin-top: 20px;
}
.bisbricknew .mhc-360__legend > span {
  display: inline-flex;
  align-items: center;
  margin-right: 24px;
  margin-bottom: 2px;
}
.bisbricknew .mhc-360__legend > span:last-child {
  margin-right: 0;
}
.bisbricknew .mhc-360__legend > span > * {
  margin-right: 8px;
}
.bisbricknew .mhc-360__legend-swatch {
  display: inline-block;
  width: 18px;
  height: 12px;
  border-radius: 2px;
}
.bisbricknew .mhc-360__legend-swatch.mhc-360__legend-swatch--self {
  background: var(--self);
}
.bisbricknew .mhc-360__legend-swatch.mhc-360__legend-swatch--manager {
  background: var(--manager);
}
.bisbricknew .mhc-360__legend-line {
  display: inline-block;
  width: 16px;
  height: 2px;
  background: var(--target);
}
.bisbricknew .mhc-360__table-toggle {
  margin-top: 8px;
}
.bisbricknew .mhc-360__table-toggle summary {
  font-size: 12.5px;
  color: var(--text-mute);
  cursor: pointer;
  padding: 6px 0;
  list-style: none;
  user-select: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.bisbricknew .mhc-360__table-toggle summary::-webkit-details-marker {
  display: none;
}
.bisbricknew .mhc-360__table-toggle summary::before {
  content: "▸";
  font-size: 10px;
  transition: transform 0.15s ease;
}
.bisbricknew .mhc-360__table-toggle[open] summary::before {
  transform: rotate(90deg);
}
.bisbricknew .mhc-360__table-toggle summary:hover {
  color: var(--navy);
}
.bisbricknew .mhc-360__table-toggle .mhc-360__detail-table {
  margin-top: 12px;
}
.bisbricknew .mhc-360__footer {
  padding: 28px 48px 36px;
  background: var(--surface-soft);
  border-top: 1px solid var(--border);
  font-size: 13px;
  font-style: italic;
  color: var(--text-mute);
  text-align: center;
}
.bisbricknew .mhc-360__footer p {
  margin: 0;
  max-width: 580px;
  margin-inline: auto;
}
@media (max-width: 720px) {
  .bisbricknew body {
    padding: 20px 12px;
  }
  .bisbricknew .mhc-360__header {
    padding: 32px 24px 24px;
  }
  .bisbricknew .mhc-360__header h1 {
    font-size: 26px;
  }
  .bisbricknew .mhc-360__overview, .bisbricknew .mhc-360__deep-dive, .bisbricknew .mhc-360__details {
    padding: 28px 24px;
  }
  .bisbricknew .mhc-360__footer {
    padding: 24px;
  }
  .bisbricknew .mhc-360__chart-wrap {
    height: 360px;
  }
  .bisbricknew .mhc-360__comp {
    padding: 18px 18px;
  }
  .bisbricknew .mhc-360__scores {
    gap: 6px;
  }
  .bisbricknew .mhc-360__score {
    font-size: 11px;
    padding: 3px 9px;
  }
  .bisbricknew .mhc-360__filter-bar {
    width: 100%;
  }
  .bisbricknew .mhc-360__filter-btn {
    flex: 1;
    padding: 8px 10px;
    font-size: 12px;
  }
  .bisbricknew .mhc-360__detail-table {
    font-size: 12px;
  }
  .bisbricknew .mhc-360__detail-table th, .bisbricknew .mhc-360__detail-table td {
    padding: 8px 10px;
  }
  .bisbricknew .mhc-360__detail-table .mhc-360__col--question {
    width: 38%;
  }
}
@media print {
  .bisbricknew body {
    background: #fff;
    padding: 0;
    font-size: 11pt;
  }
  .bisbricknew .mhc-360 {
    max-width: none;
    box-shadow: none;
    border-radius: 0;
  }
  .bisbricknew .mhc-360__header {
    background: var(--navy) !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    padding: 32px 32px 24px;
  }
  .bisbricknew .mhc-360__overview, .bisbricknew .mhc-360__deep-dive, .bisbricknew .mhc-360__details {
    padding: 24px 32px;
  }
  .bisbricknew .mhc-360__filter-bar {
    display: none;
  }
  .bisbricknew .mhc-360__details[data-filter] .mhc-360__col--manager,
.bisbricknew .mhc-360__details[data-filter] .mhc-360__col--self,
.bisbricknew .mhc-360__details[data-filter] .mhc-360__col--delta {
    display: table-cell !important;
  }
  .bisbricknew .mhc-360__comp, .bisbricknew .mhc-360__overall, .bisbricknew .mhc-360__comp-detail {
    page-break-inside: avoid;
    break-inside: avoid;
  }
  .bisbricknew .mhc-360__findings, .bisbricknew .mhc-360__recommendation {
    background: transparent !important;
  }
  .bisbricknew .mhc-360__overall {
    background: var(--surface-soft) !important;
    color: var(--text) !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .bisbricknew .mhc-360__overall h3, .bisbricknew .mhc-360__overall p {
    color: var(--text) !important;
  }
}
.bisbricknew .mhc-360 [class*=mhc-360__ico--]::before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 22px;
  margin-right: 12px;
  vertical-align: -5px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.bisbricknew .mhc-360 .mhc-360__ico--overview::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231F3A5F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='12,3 21,8 21,16 12,21 3,16 3,8'/%3E%3Cpolygon points='12,8 16,10.5 16,14.5 12,17 8,14.5 8,10.5'/%3E%3Ccircle cx='12' cy='12' r='1.2' fill='%231F3A5F' stroke='none'/%3E%3C/svg%3E");
}
.bisbricknew .mhc-360 .mhc-360__ico--deep-dive::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231F3A5F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6'/%3E%3Cline x1='20' y1='20' x2='15' y2='15'/%3E%3C/svg%3E");
}
.bisbricknew .mhc-360 .mhc-360__ico--details::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231F3A5F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='14' width='4' height='7' rx='0.5'/%3E%3Crect x='10' y='10' width='4' height='11' rx='0.5'/%3E%3Crect x='17' y='6' width='4' height='15' rx='0.5'/%3E%3C/svg%3E");
}
.bisbricknew .mhc-360 .mhc-360__stat--good {
  position: relative;
  overflow: hidden;
}
.bisbricknew .mhc-360 .mhc-360__stat--good::after {
  content: "";
  position: absolute;
  right: 8px;
  bottom: 6px;
  width: 64px;
  height: 28px;
  opacity: 0.22;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 50' fill='none' stroke='%232A6D45' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4,40 24,30 44,34 64,18 84,20 96,6'/%3E%3Cpolyline points='84,20 96,6 96,16' stroke-width='2.4'/%3E%3C/svg%3E") no-repeat right bottom;
  background-size: contain;
  pointer-events: none;
}
.bisbricknew .mhc-360 .mhc-360__stat--good > * {
  position: relative;
  z-index: 1;
}
.bisbricknew .mhc-360 .mhc-360__stat--attention {
  position: relative;
  overflow: hidden;
}
.bisbricknew .mhc-360 .mhc-360__stat--attention::after {
  content: "";
  position: absolute;
  right: 8px;
  bottom: 6px;
  width: 60px;
  height: 28px;
  opacity: 0.22;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 50' fill='none' stroke='%23B45454' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4,8 50,8 96,30'/%3E%3Cpolyline points='4,42 50,42 96,20'/%3E%3C/svg%3E") no-repeat right bottom;
  background-size: contain;
  pointer-events: none;
}
.bisbricknew .mhc-360 .mhc-360__stat--attention > * {
  position: relative;
  z-index: 1;
}
.bisbricknew .mhc-360.mhc-360 p,
.bisbricknew .mhc-360.mhc-360 li,
.bisbricknew .mhc-360.mhc-360 td,
.bisbricknew .mhc-360.mhc-360 .mhc-360__observation,
.bisbricknew .mhc-360.mhc-360 .mhc-360__recommendation {
  color: var(--text) !important;
}
.bisbricknew .mhc-360.mhc-360 h1,
.bisbricknew .mhc-360.mhc-360 h2,
.bisbricknew .mhc-360.mhc-360 h3,
.bisbricknew .mhc-360.mhc-360 h4 {
  color: var(--navy) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__findings h3 {
  color: var(--amber-warm) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__recommendation::before {
  color: var(--amber-warm) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__header,
.bisbricknew .mhc-360.mhc-360 .mhc-360__header h1,
.bisbricknew .mhc-360.mhc-360 .mhc-360__header .mhc-360__eyebrow,
.bisbricknew .mhc-360.mhc-360 .mhc-360__header .mhc-360__meta,
.bisbricknew .mhc-360.mhc-360 .mhc-360__section-num,
.bisbricknew .mhc-360.mhc-360 .mhc-360__overall,
.bisbricknew .mhc-360.mhc-360 .mhc-360__overall h3,
.bisbricknew .mhc-360.mhc-360 .mhc-360__overall p,
.bisbricknew .mhc-360.mhc-360 .mhc-360__filter-btn.is-active {
  color: #ffffff !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__header .mhc-360__eyebrow {
  color: var(--amber) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__score--self {
  color: #14618A !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__score--manager {
  color: #8A5A1F !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__score--target {
  color: var(--text-soft) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__score--ambition {
  color: var(--ambition) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__tag--D {
  color: var(--tag-D-fg) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__tag--B {
  color: var(--tag-B-fg) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__tag--E {
  color: var(--tag-E-fg) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__tag--L {
  color: var(--tag-L-fg) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__tag--NO {
  color: var(--tag-NO-fg) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__delta--positive {
  color: var(--delta-positive) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__delta--negative {
  color: var(--delta-negative) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__bar--self .mhc-360__bar-value {
  color: #14618A !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__bar--manager .mhc-360__bar-value {
  color: #8A5A1F !important;
}
.bisbricknew .mhc-360.mhc-360 strong {
  color: inherit !important;
}
.bisbricknew {
  display: flex;
  justify-content: center;
}
@charset "UTF-8";
.bisbricknew {
  /* ============================================================
  MHC Mobility — 360° Feedback rapport
  Styling voor AI-gegenereerde individuele rapporten
  Werkt samen met mhc_360_systemprompt.md
  ============================================================ */
  /* ---------- 1. Design tokens (scoped to .mhc-360) ---------- */
  /* ---------- 2. Reset & base ---------- */
  /* Demo-only body styling — niet onderdeel van het component zelf.
     In Bisbrick (of een andere host) wordt deze regel niet gebruikt;
     het component zelf is volledig zelf-bevattend onder .mhc-360. */
  /* ---------- 3. Component root + headings (alles onder .mhc-360) ---------- */
  /* ---------- 4. Header ---------- */
  /* Section markers — big amber numerals before each section title */
  /* Stats strip — hero KPI tiles in section 1 */
  /* Reasons panel — Wat zou de reden kunnen zijn? */
  /* ---------- 5. Sectie 1: Overzicht ---------- */
  /* Spider chart container */
  /* Key findings */
  /* ---------- 6. Sectie 2: Verdieping ---------- */
  /* Score pills */
  /* Rode draad */
  /* ---------- 7. Sectie 3: Details ---------- */
  /* Filter mhc-360__bar */
  /* Detail tables */
  /* Filter — driestand via data-attribuut op .mhc-360__details */
  /* Niveau-tags */
  /* Delta */
  /* ---------- 8. Bar charts per vraag (sectie 3) ---------- */
  /* Axis mhc-360__bar across the top — D B E L labels aligned with mhc-360__bar zones */
  /* Per-question block */
  /* Question header: scenario text + delta badge */
  /* Bar rows wrapper */
  /* Single mhc-360__bar row: source label + track */
  /* Bar track — background with subtle level zones */
  /* Target line — vertical marker */
  /* The actual mhc-360__bar — fills from left to its mhc-360__score */
  /* Score value label — sits directly after the mhc-360__bar's end */
  /* "Niet geobserveerd" state — striped mhc-360__bar instead of solid */
  /* Filter hides rows based on selection */
  /* Legend below charts */
  /* Toggle to show exact mhc-360__tag table below dumbbell */
  /* ---------- 9. Footer ---------- */
  /* ---------- 10. Responsive ---------- */
  /* ---------- 11. Print ---------- */
  /* ════════════════════════════════════════════════════════════════════════
     12. SECTION ICONS — CSS-only, SVG via data URI
     Icons sit before the h2 text in each section-marker. The agent adds
     a single class to the h2 (e.g. mhc-360__ico--overview); no extra
     HTML element, no inline SVG, no LLM geometry.
     ════════════════════════════════════════════════════════════════════════ */
  /* ════════════════════════════════════════════════════════════════════════
     13. TREND MOTIF — subtle upward trend line on "good" stat tiles
     Decorative only, drawn via ::after on .mhc-360__stat--good. No JS,
     no inline SVG in the HTML.
     ════════════════════════════════════════════════════════════════════════ */
  /* Attention-tile gets a subtle "spread/gap" motif instead — two diverging lines */
  /* ════════════════════════════════════════════════════════════════════════
     14. HOST-PROOFING — force every text color with !important + doubled
     root selector specificity. Wins cascade against host stylesheets that
     set global text colors on p / li / td via :root, body, or class rules
     loaded after this sheet. The earlier inheritance-based colors lose
     the cascade in some embed contexts; these rules win it outright.
     ════════════════════════════════════════════════════════════════════════ */
  /* Dark body text on light surfaces */
  /* Section + body headings — navy */
  /* Eyebrow + amber accent labels */
  /* WHITE text on dark surfaces — forced so host cannot darken */
  /* Eyebrow stays amber */
  /* Score pill colors */
  /* Tag colors keep their semantic foreground */
  /* Delta semantic colors */
  /* Bar value labels keep their accent */
  /* nested strong follows parent's forced color */
}
.bisbricknew .mhc-360 {
  /* Brand kleuren */
  --navy: #1F3A5F;
  --navy-soft: #2C4F7B;
  --amber: #C9A352;
  --amber-warm: #E29F47;
  /* Data-serie kleuren */
  --self: #2E9CCA;
  /* zelfreflectie — cyan */
  --self-bg: rgba(46, 156, 202, 0.12);
  --self-border: rgba(46, 156, 202, 0.45);
  --manager: #E29F47;
  /* manager — warm amber */
  --manager-bg: rgba(226, 159, 71, 0.12);
  --manager-border: rgba(226, 159, 71, 0.45);
  --target: #555555;
  /* target — neutraal grijs (dotted in chart) */
  --ambition: #6FAE83;
  /* ambitie — sage groen (dashed in chart) */
  /* Niveau-tags (D / B / E / L) */
  --tag-D-bg: #E8F2F9;
  --tag-D-fg: #1F567F;
  --tag-B-bg: #FAE9D4;
  --tag-B-fg: #8A5A1F;
  --tag-E-bg: #DCEDE0;
  --tag-E-fg: #2A6D45;
  --tag-L-bg: #E8DEF2;
  --tag-L-fg: #4E3878;
  --tag-NO-bg: #ECEEF1;
  --tag-NO-fg: #6C757D;
  /* Delta */
  --delta-positive: #2A6D45;
  --delta-negative: #B23A48;
  --delta-zero: #6C757D;
  /* Surface */
  --bg: #FBFAF7;
  --surface: #FFFFFF;
  --surface-soft: #F4F1EA;
  --border: #E5E7EB;
  --border-soft: #EFEDE8;
  /* Tekst */
  --text: #1F2937;
  --text-soft: #4B5563;
  --text-mute: #6B7280;
  /* Type & layout */
  --font: "Helvetica Neue", "Arial", system-ui, -apple-system, sans-serif;
  --radius: 8px;
  --radius-lg: 12px;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}
.bisbricknew *, .bisbricknew *::before, .bisbricknew *::after {
  box-sizing: border-box;
}
.bisbricknew html {
  -webkit-text-size-adjust: 100%;
}
.bisbricknew body {
  margin: 0;
  padding: 40px 20px 80px;
  font-family: "Helvetica Neue", "Arial", system-ui, -apple-system, sans-serif;
  font-size: 15px;
  line-height: 1.55;
  color: #1F2937;
  background: #FBFAF7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.bisbricknew .mhc-360 {
  max-width: 880px;
  margin: 0 auto;
  background: var(--surface);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  overflow: hidden;
  font-family: var(--font);
  font-size: 15px;
  line-height: 1.55;
  color: var(--text);
}
.bisbricknew .mhc-360 h1,
.bisbricknew .mhc-360 h2,
.bisbricknew .mhc-360 h3,
.bisbricknew .mhc-360 h4 {
  margin: 0;
  font-weight: 600;
  color: var(--navy);
  line-height: 1.25;
}
.bisbricknew .mhc-360 p {
  margin: 0 0 0.9em;
}
.bisbricknew .mhc-360 ul {
  margin: 0 0 0.9em;
  padding-left: 1.4em;
}
.bisbricknew .mhc-360 li {
  margin-bottom: 0.5em;
}
.bisbricknew .mhc-360__header {
  padding: 48px 48px 36px;
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-soft) 100%);
  color: #fff;
  position: relative;
  overflow: hidden;
}
.bisbricknew .mhc-360__header::before {
  content: "";
  position: absolute;
  top: -40px;
  right: -40px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(201, 163, 82, 0.18) 0%, transparent 70%);
  pointer-events: none;
}
.bisbricknew .mhc-360__header .mhc-360__eyebrow {
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--amber);
  margin: 0 0 12px;
  font-weight: 600;
  position: relative;
}
.bisbricknew .mhc-360__header h1 {
  font-size: 32px;
  color: #fff;
  margin: 0 0 12px;
  letter-spacing: -0.01em;
  position: relative;
}
.bisbricknew .mhc-360__header .mhc-360__meta {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.78);
  margin: 0;
  font-style: italic;
  position: relative;
}
.bisbricknew .mhc-360__section-marker {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 0 28px;
}
.bisbricknew .mhc-360__section-num {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
  height: 44px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--amber) 0%, var(--amber-warm) 100%);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.02em;
  box-shadow: 0 2px 8px rgba(201, 163, 82, 0.3);
}
.bisbricknew .mhc-360__section-marker h2 {
  margin: 0;
  font-size: 22px;
  padding-bottom: 0;
  border-bottom: none;
}
.bisbricknew .mhc-360__stats {
  display: flex;
  gap: 12px;
  margin: 0 0 32px;
}
.bisbricknew .mhc-360__stat {
  flex: 1 1 0;
  min-width: 0;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px 16px 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  position: relative;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.bisbricknew .mhc-360__stat:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-sm);
}
.bisbricknew .mhc-360__stat .mhc-360__stat-label {
  font-size: 10.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-mute);
  font-weight: 600;
  margin-bottom: 4px;
}
.bisbricknew .mhc-360__stat .mhc-360__stat-value {
  font-size: 22px;
  font-weight: 700;
  color: var(--navy);
  line-height: 1.1;
  letter-spacing: -0.01em;
}
.bisbricknew .mhc-360__stat .mhc-360__stat-value.mhc-360__stat-value--text {
  font-size: 17px;
}
.bisbricknew .mhc-360__stat .mhc-360__stat-of {
  font-size: 16px;
  color: var(--text-mute);
  font-weight: 500;
}
.bisbricknew .mhc-360__stat .mhc-360__stat-sub {
  font-size: 12px;
  color: var(--text-soft);
  margin-top: auto;
  padding-top: 4px;
}
.bisbricknew .mhc-360__stat.mhc-360__stat--attention {
  border-color: var(--manager-border);
  background: linear-gradient(135deg, var(--manager-bg) 0%, var(--surface) 60%);
}
.bisbricknew .mhc-360__stat.mhc-360__stat--attention .mhc-360__stat-value {
  color: #946D24;
}
.bisbricknew .mhc-360__stat.mhc-360__stat--good {
  border-color: rgba(111, 174, 131, 0.4);
  background: linear-gradient(135deg, rgba(111, 174, 131, 0.1) 0%, var(--surface) 60%);
}
.bisbricknew .mhc-360__stat.mhc-360__stat--good .mhc-360__stat-value {
  color: #2A6D45;
}
.bisbricknew .mhc-360__reasons {
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 28px 30px 24px;
  margin-top: 24px;
  page-break-inside: avoid;
  break-inside: avoid;
}
.bisbricknew .mhc-360__reasons > h3 {
  font-size: 18px;
  margin: 0 0 8px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.bisbricknew .mhc-360__reasons > h3::before {
  content: "?";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--amber);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  flex-shrink: 0;
}
.bisbricknew .mhc-360__reasons-intro {
  color: var(--text-soft);
  font-size: 13.5px;
  margin: 0 0 22px;
  padding-left: 40px;
}
.bisbricknew .mhc-360__reasons-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
.bisbricknew .mhc-360__reason {
  flex: 1 1 calc(50% - 8px);
  min-width: 260px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px 20px 14px;
  position: relative;
}
.bisbricknew .mhc-360__reason .mhc-360__reason-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 10px;
}
.bisbricknew .mhc-360__reason.mhc-360__reason--self-high .mhc-360__reason-icon {
  background: var(--self-bg);
  color: var(--self);
}
.bisbricknew .mhc-360__reason.mhc-360__reason--manager-high .mhc-360__reason-icon {
  background: var(--manager-bg);
  color: var(--manager);
}
.bisbricknew .mhc-360__reason.mhc-360__reason--aligned-below .mhc-360__reason-icon {
  background: rgba(178, 58, 72, 0.1);
  color: var(--delta-negative);
}
.bisbricknew .mhc-360__reason.mhc-360__reason--aligned-ok .mhc-360__reason-icon {
  background: rgba(42, 109, 69, 0.1);
  color: var(--delta-positive);
}
.bisbricknew .mhc-360__reason h4 {
  font-size: 14px;
  color: var(--navy);
  margin: 0 0 10px;
  font-weight: 600;
  line-height: 1.35;
}
.bisbricknew .mhc-360__reason ul {
  margin: 0;
  padding-left: 18px;
  font-size: 13px;
  color: var(--text);
  line-height: 1.5;
}
.bisbricknew .mhc-360__reason li {
  margin-bottom: 6px;
}
.bisbricknew .mhc-360__reason li:last-child {
  margin-bottom: 0;
}
.bisbricknew .mhc-360__reason li::marker {
  color: var(--amber);
}
.bisbricknew .mhc-360__overview {
  padding: 40px 48px;
  border-bottom: 1px solid var(--border);
}
.bisbricknew .mhc-360__overview h2 {
  font-size: 22px;
  margin: 0 0 24px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--amber);
  display: inline-block;
}
.bisbricknew .mhc-360__chart-wrap {
  position: relative;
  height: 460px;
  margin: 0 0 36px;
  padding: 16px 8px 8px;
  background: var(--surface-soft);
  border-radius: var(--radius);
}
.bisbricknew .mhc-360__findings {
  background: var(--surface-soft);
  border-left: 4px solid var(--amber);
  padding: 20px 24px 16px;
  border-radius: 0 var(--radius) var(--radius) 0;
}
.bisbricknew .mhc-360__findings h3 {
  font-size: 14px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--amber-warm);
  margin: 0 0 12px;
  font-weight: 700;
}
.bisbricknew .mhc-360__findings ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}
.bisbricknew .mhc-360__findings li {
  position: relative;
  padding-left: 22px;
  margin-bottom: 10px;
  color: var(--text);
  line-height: 1.55;
}
.bisbricknew .mhc-360__findings li:last-child {
  margin-bottom: 0;
}
.bisbricknew .mhc-360__findings li::before {
  content: "▸";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--amber);
  font-weight: bold;
}
.bisbricknew .mhc-360__deep-dive {
  padding: 40px 48px;
  border-bottom: 1px solid var(--border);
}
.bisbricknew .mhc-360__deep-dive > h2:first-child {
  font-size: 22px;
  margin: 0 0 28px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--amber);
  display: inline-block;
}
.bisbricknew .mhc-360__comp {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 22px 24px;
  margin-bottom: 18px;
  page-break-inside: avoid;
  break-inside: avoid;
}
.bisbricknew .mhc-360__comp header {
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px dashed var(--border-soft);
}
.bisbricknew .mhc-360__comp header h3 {
  font-size: 17px;
  margin: 0 0 10px;
}
.bisbricknew .mhc-360__scores {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.bisbricknew .mhc-360__score {
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 999px;
  white-space: nowrap;
}
.bisbricknew .mhc-360__score--self {
  background: var(--self-bg);
  color: #14618A;
  border: 1px solid var(--self-border);
}
.bisbricknew .mhc-360__score--manager {
  background: var(--manager-bg);
  color: #8A5A1F;
  border: 1px solid var(--manager-border);
}
.bisbricknew .mhc-360__score--target {
  background: transparent;
  color: var(--text-soft);
  border: 1px dashed #B5B5B5;
}
.bisbricknew .mhc-360__score--ambition {
  background: transparent;
  color: var(--ambition);
  border: 1px dotted var(--ambition);
}
.bisbricknew .mhc-360__comp .mhc-360__observation {
  color: var(--text);
  margin-bottom: 12px;
}
.bisbricknew .mhc-360__comp .mhc-360__recommendation {
  background: var(--surface-soft);
  border-left: 3px solid var(--amber);
  padding: 12px 16px;
  border-radius: 0 var(--radius) var(--radius) 0;
  margin: 0;
  font-size: 14.5px;
  color: var(--text);
}
.bisbricknew .mhc-360__comp .mhc-360__recommendation::before {
  content: "Volgende stap";
  display: block;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--amber-warm);
  font-weight: 700;
  margin-bottom: 4px;
}
.bisbricknew .mhc-360__overall {
  background: var(--navy);
  color: #fff;
  border-radius: var(--radius);
  padding: 24px 28px;
  margin-top: 24px;
  page-break-inside: avoid;
  break-inside: avoid;
}
.bisbricknew .mhc-360__overall h3 {
  color: #fff;
  font-size: 17px;
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--amber);
  display: inline-block;
}
.bisbricknew .mhc-360__overall p {
  margin: 0;
  color: rgba(255, 255, 255, 0.92);
  font-size: 15px;
  line-height: 1.6;
}
.bisbricknew .mhc-360__details {
  padding: 40px 48px;
}
.bisbricknew .mhc-360__details > h2 {
  font-size: 22px;
  margin: 0 0 12px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--amber);
  display: inline-block;
}
.bisbricknew .mhc-360__details-intro {
  color: var(--text-soft);
  font-size: 14px;
  margin: 0 0 24px;
}
.bisbricknew .mhc-360__filter-bar {
  display: inline-flex;
  background: var(--surface-soft);
  border-radius: var(--radius);
  padding: 4px;
  margin-bottom: 28px;
  gap: 0;
}
.bisbricknew .mhc-360__filter-btn {
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  padding: 8px 16px;
  border: none;
  background: transparent;
  color: var(--text-soft);
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.15s ease;
}
.bisbricknew .mhc-360__filter-btn:hover {
  color: var(--navy);
}
.bisbricknew .mhc-360__filter-btn.is-active {
  background: var(--navy);
  color: #fff;
  box-shadow: var(--shadow-sm);
}
.bisbricknew .mhc-360__filter-btn:focus-visible {
  outline: 2px solid var(--amber);
  outline-offset: 2px;
}
.bisbricknew .mhc-360__comp-detail {
  margin-bottom: 28px;
  page-break-inside: avoid;
  break-inside: avoid;
}
.bisbricknew .mhc-360__comp-detail h3 {
  font-size: 15px;
  margin: 0 0 10px;
  color: var(--navy);
  font-weight: 600;
}
.bisbricknew .mhc-360__detail-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  font-size: 13.5px;
}
.bisbricknew .mhc-360__detail-table thead {
  background: var(--surface-soft);
}
.bisbricknew .mhc-360__detail-table th {
  text-align: left;
  padding: 10px 14px;
  font-weight: 600;
  color: var(--navy);
  font-size: 12px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--border);
}
.bisbricknew .mhc-360__detail-table td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--border-soft);
  vertical-align: middle;
}
.bisbricknew .mhc-360__detail-table tr:last-child td {
  border-bottom: none;
}
.bisbricknew .mhc-360__detail-table tbody tr:hover {
  background: var(--surface-soft);
}
.bisbricknew .mhc-360__detail-table .mhc-360__col--question {
  width: 42%;
  color: var(--text);
}
.bisbricknew .mhc-360__detail-table .mhc-360__col--self,
.bisbricknew .mhc-360__detail-table .mhc-360__col--manager {
  width: 22%;
  text-align: center;
}
.bisbricknew .mhc-360__detail-table .mhc-360__col--delta {
  width: 14%;
  text-align: center;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.bisbricknew .mhc-360__detail-table th.mhc-360__col--self,
.bisbricknew .mhc-360__detail-table td.mhc-360__col--self {
  background: rgba(46, 156, 202, 0.04);
}
.bisbricknew .mhc-360__detail-table th.mhc-360__col--manager,
.bisbricknew .mhc-360__detail-table td.mhc-360__col--manager {
  background: rgba(226, 159, 71, 0.04);
}
.bisbricknew .mhc-360__details[data-filter=self] .mhc-360__col--manager,
.bisbricknew .mhc-360__details[data-filter=self] .mhc-360__col--delta {
  display: none;
}
.bisbricknew .mhc-360__details[data-filter=manager] .mhc-360__col--self,
.bisbricknew .mhc-360__details[data-filter=manager] .mhc-360__col--delta {
  display: none;
}
.bisbricknew .mhc-360__tag {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.4;
  white-space: nowrap;
}
.bisbricknew .mhc-360__tag--D {
  background: var(--tag-D-bg);
  color: var(--tag-D-fg);
}
.bisbricknew .mhc-360__tag--B {
  background: var(--tag-B-bg);
  color: var(--tag-B-fg);
}
.bisbricknew .mhc-360__tag--E {
  background: var(--tag-E-bg);
  color: var(--tag-E-fg);
}
.bisbricknew .mhc-360__tag--L {
  background: var(--tag-L-bg);
  color: var(--tag-L-fg);
}
.bisbricknew .mhc-360__tag--NO {
  background: var(--tag-NO-bg);
  color: var(--tag-NO-fg);
  font-style: italic;
  font-weight: 500;
}
.bisbricknew .mhc-360__delta--positive {
  color: var(--delta-positive);
}
.bisbricknew .mhc-360__delta--negative {
  color: var(--delta-negative);
}
.bisbricknew .mhc-360__delta--zero {
  color: var(--delta-zero);
}
.bisbricknew .mhc-360__bar-chart {
  background: var(--surface-soft);
  border-radius: var(--radius);
  padding: 22px 22px 20px;
  margin: 12px 0 18px;
}
.bisbricknew .mhc-360__axis {
  display: flex;
  margin-bottom: 14px;
  padding-left: 82px;
  /* matches .mhc-360__bar-source width + gap */
  padding-right: 70px;
  /* leaves room for the value labels at end of bars */
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--text-mute);
  border-bottom: 1px dashed var(--border);
  padding-bottom: 8px;
}
.bisbricknew .mhc-360__axis .mhc-360__axis-label {
  flex: 1 1 0;
  text-align: center;
  position: relative;
}
.bisbricknew .mhc-360__question {
  margin-bottom: 22px;
  padding-bottom: 18px;
  border-bottom: 1px dashed var(--border);
}
.bisbricknew .mhc-360__question:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}
.bisbricknew .mhc-360__q-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}
.bisbricknew .mhc-360__q-label {
  flex: 1 1 auto;
  font-size: 13px;
  color: var(--text);
  font-weight: 500;
  line-height: 1.35;
}
.bisbricknew .mhc-360__q-delta {
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
  font-variant-numeric: tabular-nums;
  padding: 3px 12px;
  border-radius: 999px;
  background: var(--surface);
  border: 1px solid var(--border);
  min-width: 44px;
}
.bisbricknew .mhc-360__q-delta.mhc-360__delta--positive {
  color: var(--delta-positive);
  border-color: rgba(42, 109, 69, 0.3);
}
.bisbricknew .mhc-360__q-delta.mhc-360__delta--negative {
  color: var(--delta-negative);
  border-color: rgba(178, 58, 72, 0.3);
}
.bisbricknew .mhc-360__q-delta.mhc-360__delta--zero {
  color: var(--text-mute);
  font-weight: 500;
}
.bisbricknew .mhc-360__q-delta.mhc-360__delta--NO {
  color: var(--text-mute);
  font-style: italic;
  font-weight: 500;
}
.bisbricknew .mhc-360__bar-rows {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.bisbricknew .mhc-360__bar-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.bisbricknew .mhc-360__bar-source {
  flex: 0 0 72px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-soft);
}
.bisbricknew .mhc-360__bar-row.mhc-360__bar-row--self .mhc-360__bar-source {
  color: #14618A;
}
.bisbricknew .mhc-360__bar-row.mhc-360__bar-row--manager .mhc-360__bar-source {
  color: #8A5A1F;
}
.bisbricknew .mhc-360__bar-track {
  flex: 1 1 auto;
  position: relative;
  height: 22px;
  background: linear-gradient(to right, var(--tag-D-bg) 0%, var(--tag-D-bg) 25%, var(--tag-B-bg) 25%, var(--tag-B-bg) 50%, var(--tag-E-bg) 50%, var(--tag-E-bg) 75%, var(--tag-L-bg) 75%, var(--tag-L-bg) 100%);
  border-radius: 4px;
  opacity: 0.95;
  margin-right: 60px;
  /* room for value label */
}
.bisbricknew .mhc-360__bar-track::after {
  /* faint zone divider lines */
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, transparent 0, transparent calc(25% - 1px), rgba(255, 255, 255, 0.6) calc(25% - 1px), rgba(255, 255, 255, 0.6) 25%, transparent 25%, transparent calc(50% - 1px), rgba(255, 255, 255, 0.6) calc(50% - 1px), rgba(255, 255, 255, 0.6) 50%, transparent 50%, transparent calc(75% - 1px), rgba(255, 255, 255, 0.6) calc(75% - 1px), rgba(255, 255, 255, 0.6) 75%, transparent 75%);
  pointer-events: none;
  border-radius: 4px;
}
.bisbricknew .mhc-360__target-line {
  position: absolute;
  top: -3px;
  bottom: -3px;
  width: 2px;
  background: var(--target);
  /* Map mhc-360__score 1→25%, 2→50%, 3→75%, 4→100% */
  left: calc(var(--score) / 4 * 100%);
  border-radius: 1px;
  opacity: 0.65;
  transform: translateX(-50%);
  z-index: 1;
}
.bisbricknew .mhc-360__target-line::before {
  content: "▼";
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 8px;
  color: var(--target);
  opacity: 0.7;
}
.bisbricknew .mhc-360__bar {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: calc(var(--score) / 4 * 100%);
  border-radius: 4px;
  z-index: 2;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  transition: width 0.4s ease;
  overflow: visible;
}
.bisbricknew .mhc-360__bar--self {
  background: linear-gradient(to right, var(--self) 0%, #45B0DC 100%);
  color: #fff;
}
.bisbricknew .mhc-360__bar--manager {
  background: linear-gradient(to right, var(--manager) 0%, #EFB264 100%);
  color: #fff;
}
.bisbricknew .mhc-360__bar-value {
  position: absolute;
  left: calc(100% + 8px);
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.bisbricknew .mhc-360__bar--self .mhc-360__bar-value {
  color: #14618A;
}
.bisbricknew .mhc-360__bar--manager .mhc-360__bar-value {
  color: #8A5A1F;
}
.bisbricknew .mhc-360__bar-track.mhc-360__bar-track--no .mhc-360__bar-no-label {
  position: absolute;
  top: 50%;
  left: 12px;
  transform: translateY(-50%);
  font-size: 11px;
  font-style: italic;
  color: var(--text-mute);
  z-index: 2;
}
.bisbricknew .mhc-360__bar-track.mhc-360__bar-track--no::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(-45deg, transparent, transparent 6px, rgba(108, 117, 125, 0.12) 6px, rgba(108, 117, 125, 0.12) 12px);
  border-radius: 4px;
  z-index: 1;
}
.bisbricknew .mhc-360__details[data-filter=self] .mhc-360__bar-row--manager,
.bisbricknew .mhc-360__details[data-filter=self] .mhc-360__q-delta,
.bisbricknew .mhc-360__details[data-filter=manager] .mhc-360__bar-row--self,
.bisbricknew .mhc-360__details[data-filter=manager] .mhc-360__q-delta {
  display: none;
}
.bisbricknew .mhc-360__legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 14px 20px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-size: 12.5px;
  color: var(--text-soft);
  margin-top: 20px;
}
.bisbricknew .mhc-360__legend > span {
  display: inline-flex;
  align-items: center;
  margin-right: 24px;
  margin-bottom: 2px;
}
.bisbricknew .mhc-360__legend > span:last-child {
  margin-right: 0;
}
.bisbricknew .mhc-360__legend > span > * {
  margin-right: 8px;
}
.bisbricknew .mhc-360__legend-swatch {
  display: inline-block;
  width: 18px;
  height: 12px;
  border-radius: 2px;
}
.bisbricknew .mhc-360__legend-swatch.mhc-360__legend-swatch--self {
  background: var(--self);
}
.bisbricknew .mhc-360__legend-swatch.mhc-360__legend-swatch--manager {
  background: var(--manager);
}
.bisbricknew .mhc-360__legend-line {
  display: inline-block;
  width: 16px;
  height: 2px;
  background: var(--target);
}
.bisbricknew .mhc-360__table-toggle {
  margin-top: 8px;
}
.bisbricknew .mhc-360__table-toggle summary {
  font-size: 12.5px;
  color: var(--text-mute);
  cursor: pointer;
  padding: 6px 0;
  list-style: none;
  user-select: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.bisbricknew .mhc-360__table-toggle summary::-webkit-details-marker {
  display: none;
}
.bisbricknew .mhc-360__table-toggle summary::before {
  content: "▸";
  font-size: 10px;
  transition: transform 0.15s ease;
}
.bisbricknew .mhc-360__table-toggle[open] summary::before {
  transform: rotate(90deg);
}
.bisbricknew .mhc-360__table-toggle summary:hover {
  color: var(--navy);
}
.bisbricknew .mhc-360__table-toggle .mhc-360__detail-table {
  margin-top: 12px;
}
.bisbricknew .mhc-360__footer {
  padding: 28px 48px 36px;
  background: var(--surface-soft);
  border-top: 1px solid var(--border);
  font-size: 13px;
  font-style: italic;
  color: var(--text-mute);
  text-align: center;
}
.bisbricknew .mhc-360__footer p {
  margin: 0;
  max-width: 580px;
  margin-inline: auto;
}
@media (max-width: 720px) {
  .bisbricknew body {
    padding: 20px 12px;
  }
  .bisbricknew .mhc-360__header {
    padding: 32px 24px 24px;
  }
  .bisbricknew .mhc-360__header h1 {
    font-size: 26px;
  }
  .bisbricknew .mhc-360__overview, .bisbricknew .mhc-360__deep-dive, .bisbricknew .mhc-360__details {
    padding: 28px 24px;
  }
  .bisbricknew .mhc-360__footer {
    padding: 24px;
  }
  .bisbricknew .mhc-360__chart-wrap {
    height: 360px;
  }
  .bisbricknew .mhc-360__comp {
    padding: 18px 18px;
  }
  .bisbricknew .mhc-360__scores {
    gap: 6px;
  }
  .bisbricknew .mhc-360__score {
    font-size: 11px;
    padding: 3px 9px;
  }
  .bisbricknew .mhc-360__filter-bar {
    width: 100%;
  }
  .bisbricknew .mhc-360__filter-btn {
    flex: 1;
    padding: 8px 10px;
    font-size: 12px;
  }
  .bisbricknew .mhc-360__detail-table {
    font-size: 12px;
  }
  .bisbricknew .mhc-360__detail-table th, .bisbricknew .mhc-360__detail-table td {
    padding: 8px 10px;
  }
  .bisbricknew .mhc-360__detail-table .mhc-360__col--question {
    width: 38%;
  }
}
@media print {
  .bisbricknew body {
    background: #fff;
    padding: 0;
    font-size: 11pt;
  }
  .bisbricknew .mhc-360 {
    max-width: none;
    box-shadow: none;
    border-radius: 0;
  }
  .bisbricknew .mhc-360__header {
    background: var(--navy) !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    padding: 32px 32px 24px;
  }
  .bisbricknew .mhc-360__overview, .bisbricknew .mhc-360__deep-dive, .bisbricknew .mhc-360__details {
    padding: 24px 32px;
  }
  .bisbricknew .mhc-360__filter-bar {
    display: none;
  }
  .bisbricknew .mhc-360__details[data-filter] .mhc-360__col--manager,
.bisbricknew .mhc-360__details[data-filter] .mhc-360__col--self,
.bisbricknew .mhc-360__details[data-filter] .mhc-360__col--delta {
    display: table-cell !important;
  }
  .bisbricknew .mhc-360__comp, .bisbricknew .mhc-360__overall, .bisbricknew .mhc-360__comp-detail {
    page-break-inside: avoid;
    break-inside: avoid;
  }
  .bisbricknew .mhc-360__findings, .bisbricknew .mhc-360__recommendation {
    background: transparent !important;
  }
  .bisbricknew .mhc-360__overall {
    background: var(--surface-soft) !important;
    color: var(--text) !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .bisbricknew .mhc-360__overall h3, .bisbricknew .mhc-360__overall p {
    color: var(--text) !important;
  }
}
.bisbricknew .mhc-360 [class*=mhc-360__ico--]::before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 22px;
  margin-right: 12px;
  vertical-align: -5px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.bisbricknew .mhc-360 .mhc-360__ico--overview::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231F3A5F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='12,3 21,8 21,16 12,21 3,16 3,8'/%3E%3Cpolygon points='12,8 16,10.5 16,14.5 12,17 8,14.5 8,10.5'/%3E%3Ccircle cx='12' cy='12' r='1.2' fill='%231F3A5F' stroke='none'/%3E%3C/svg%3E");
}
.bisbricknew .mhc-360 .mhc-360__ico--deep-dive::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231F3A5F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6'/%3E%3Cline x1='20' y1='20' x2='15' y2='15'/%3E%3C/svg%3E");
}
.bisbricknew .mhc-360 .mhc-360__ico--details::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231F3A5F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='14' width='4' height='7' rx='0.5'/%3E%3Crect x='10' y='10' width='4' height='11' rx='0.5'/%3E%3Crect x='17' y='6' width='4' height='15' rx='0.5'/%3E%3C/svg%3E");
}
.bisbricknew .mhc-360 .mhc-360__stat--good {
  position: relative;
  overflow: hidden;
}
.bisbricknew .mhc-360 .mhc-360__stat--good::after {
  content: "";
  position: absolute;
  right: 8px;
  bottom: 6px;
  width: 64px;
  height: 28px;
  opacity: 0.22;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 50' fill='none' stroke='%232A6D45' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4,40 24,30 44,34 64,18 84,20 96,6'/%3E%3Cpolyline points='84,20 96,6 96,16' stroke-width='2.4'/%3E%3C/svg%3E") no-repeat right bottom;
  background-size: contain;
  pointer-events: none;
}
.bisbricknew .mhc-360 .mhc-360__stat--good > * {
  position: relative;
  z-index: 1;
}
.bisbricknew .mhc-360 .mhc-360__stat--attention {
  position: relative;
  overflow: hidden;
}
.bisbricknew .mhc-360 .mhc-360__stat--attention::after {
  content: "";
  position: absolute;
  right: 8px;
  bottom: 6px;
  width: 60px;
  height: 28px;
  opacity: 0.22;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 50' fill='none' stroke='%23B45454' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4,8 50,8 96,30'/%3E%3Cpolyline points='4,42 50,42 96,20'/%3E%3C/svg%3E") no-repeat right bottom;
  background-size: contain;
  pointer-events: none;
}
.bisbricknew .mhc-360 .mhc-360__stat--attention > * {
  position: relative;
  z-index: 1;
}
.bisbricknew .mhc-360.mhc-360 p,
.bisbricknew .mhc-360.mhc-360 li,
.bisbricknew .mhc-360.mhc-360 td,
.bisbricknew .mhc-360.mhc-360 .mhc-360__observation,
.bisbricknew .mhc-360.mhc-360 .mhc-360__recommendation {
  color: var(--text) !important;
}
.bisbricknew .mhc-360.mhc-360 h1,
.bisbricknew .mhc-360.mhc-360 h2,
.bisbricknew .mhc-360.mhc-360 h3,
.bisbricknew .mhc-360.mhc-360 h4 {
  color: var(--navy) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__findings h3 {
  color: var(--amber-warm) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__recommendation::before {
  color: var(--amber-warm) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__header,
.bisbricknew .mhc-360.mhc-360 .mhc-360__header h1,
.bisbricknew .mhc-360.mhc-360 .mhc-360__header .mhc-360__eyebrow,
.bisbricknew .mhc-360.mhc-360 .mhc-360__header .mhc-360__meta,
.bisbricknew .mhc-360.mhc-360 .mhc-360__section-num,
.bisbricknew .mhc-360.mhc-360 .mhc-360__overall,
.bisbricknew .mhc-360.mhc-360 .mhc-360__overall h3,
.bisbricknew .mhc-360.mhc-360 .mhc-360__overall p,
.bisbricknew .mhc-360.mhc-360 .mhc-360__filter-btn.is-active {
  color: #ffffff !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__header .mhc-360__eyebrow {
  color: var(--amber) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__score--self {
  color: #14618A !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__score--manager {
  color: #8A5A1F !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__score--target {
  color: var(--text-soft) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__score--ambition {
  color: var(--ambition) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__tag--D {
  color: var(--tag-D-fg) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__tag--B {
  color: var(--tag-B-fg) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__tag--E {
  color: var(--tag-E-fg) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__tag--L {
  color: var(--tag-L-fg) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__tag--NO {
  color: var(--tag-NO-fg) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__delta--positive {
  color: var(--delta-positive) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__delta--negative {
  color: var(--delta-negative) !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__bar--self .mhc-360__bar-value {
  color: #14618A !important;
}
.bisbricknew .mhc-360.mhc-360 .mhc-360__bar--manager .mhc-360__bar-value {
  color: #8A5A1F !important;
}
.bisbricknew .mhc-360.mhc-360 strong {
  color: inherit !important;
}