/*!
 * Bootstrap v5.1.3 (https://getbootstrap.com/)
 * Copyright 2011-2021 The Bootstrap Authors
 * Copyright 2011-2021 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */
/* Bootstrap v5.1.3 (MIT) - reduced to the rules this site uses (grid, utilities, cards, carousel).
   Merged here from vendor/bootstrap/css/bootstrap.min.css; the original stays in vendor/ for regenerating. */
:root{--bs-blue:#0d6efd;--bs-indigo:#6610f2;--bs-purple:#6f42c1;--bs-pink:#d63384;--bs-red:#dc3545;--bs-orange:#fd7e14;--bs-yellow:#ffc107;--bs-green:#198754;--bs-teal:#20c997;--bs-cyan:#0dcaf0;--bs-white:#fff;--bs-gray:#6c757d;--bs-gray-dark:#343a40;--bs-gray-100:#f8f9fa;--bs-gray-200:#e9ecef;--bs-gray-300:#dee2e6;--bs-gray-400:#ced4da;--bs-gray-500:#adb5bd;--bs-gray-600:#6c757d;--bs-gray-700:#495057;--bs-gray-800:#343a40;--bs-gray-900:#212529;--bs-primary:#0d6efd;--bs-secondary:#6c757d;--bs-success:#198754;--bs-info:#0dcaf0;--bs-warning:#ffc107;--bs-danger:#dc3545;--bs-light:#f8f9fa;--bs-dark:#212529;--bs-primary-rgb:13,110,253;--bs-secondary-rgb:108,117,125;--bs-success-rgb:25,135,84;--bs-info-rgb:13,202,240;--bs-warning-rgb:255,193,7;--bs-danger-rgb:220,53,69;--bs-light-rgb:248,249,250;--bs-dark-rgb:33,37,41;--bs-white-rgb:255,255,255;--bs-black-rgb:0,0,0;--bs-body-color-rgb:33,37,41;--bs-body-bg-rgb:255,255,255;--bs-font-sans-serif:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--bs-font-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--bs-gradient:linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));--bs-body-font-family:var(--bs-font-sans-serif);--bs-body-font-size:1rem;--bs-body-font-weight:400;--bs-body-line-height:1.5;--bs-body-color:#212529;--bs-body-bg:#fff}*,::after,::before{box-sizing:border-box}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}body{margin:0;font-family:var(--bs-body-font-family);font-size:var(--bs-body-font-size);font-weight:var(--bs-body-font-weight);line-height:var(--bs-body-line-height);color:var(--bs-body-color);text-align:var(--bs-body-text-align);background-color:var(--bs-body-bg);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}hr{margin:1rem 0;color:inherit;background-color:currentColor;border:0;opacity:.25}hr:not([size]){height:1px}.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.2}.h1,h1{font-size:calc(1.375rem + 1.5vw)}@media (min-width:1200px){.h1,h1{font-size:2.5rem}}.h2,h2{font-size:calc(1.325rem + .9vw)}@media (min-width:1200px){.h2,h2{font-size:2rem}}.h3,h3{font-size:calc(1.3rem + .6vw)}@media (min-width:1200px){.h3,h3{font-size:1.75rem}}.h4,h4{font-size:calc(1.275rem + .3vw)}@media (min-width:1200px){.h4,h4{font-size:1.5rem}}.h5,h5{font-size:1.25rem}.h6,h6{font-size:1rem}p{margin-top:0;margin-bottom:1rem}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul{padding-left:2rem;margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}.small,small{font-size:.875em}sub,sup{position:relative;font-size:.75em;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:#0d6efd;text-decoration:underline}a:hover{color:#0a58ca}a:not([href]):not([class]),a:not([href]):not([class]):hover{color:inherit;text-decoration:none}code,pre{font-family:var(--bs-font-monospace);direction:ltr;unicode-bidi:bidi-override}pre{display:block;margin-top:0;margin-bottom:1rem;overflow:auto;font-size:.875em}pre code{font-size:inherit;color:inherit;word-break:normal}code{font-size:.875em;color:#d63384;word-wrap:break-word}a>code{color:inherit}figure{margin:0 0 1rem}img,svg{vertical-align:middle}table{caption-side:bottom;border-collapse:collapse}th{text-align:inherit;text-align:-webkit-match-parent}td,th{border:0 solid;border-color:inherit}button{border-radius:0}button:focus:not(:focus-visible){outline:0}button,input,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,select{text-transform:none}[role=button],[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}select{word-wrap:normal}select:disabled{opacity:1}[list]::-webkit-calendar-picker-indicator{display:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}::-moz-focus-inner{padding:0;border-style:none}textarea{resize:vertical}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-fields-wrapper,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-text,::-webkit-datetime-edit-year-field{padding:0}::-webkit-inner-spin-button{height:auto}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-color-swatch-wrapper{padding:0}::-webkit-file-upload-button{font:inherit;font:inherit;-webkit-appearance:button}::file-selector-button{font:inherit}iframe{border:0}progress{vertical-align:baseline}[hidden]{display:none!important}.blockquote{margin-bottom:1rem;font-size:1.25rem}.blockquote>:last-child{margin-bottom:0}.img-fluid{max-width:100%;height:auto}.figure{display:inline-block}.container{width:100%;padding-right:var(--bs-gutter-x,.75rem);padding-left:var(--bs-gutter-x,.75rem);margin-right:auto;margin-left:auto}@media (min-width:576px){.container{max-width:540px}}@media (min-width:768px){.container{max-width:720px}}@media (min-width:992px){.container{max-width:960px}}@media (min-width:1200px){.container{max-width:1140px}}@media (min-width:1400px){.container{max-width:1320px}}.row{--bs-gutter-x:1.5rem;--bs-gutter-y:0;display:flex;flex-wrap:wrap;margin-top:calc(-1 * var(--bs-gutter-y));margin-right:calc(-.5 * var(--bs-gutter-x));margin-left:calc(-.5 * var(--bs-gutter-x))}.row>*{flex-shrink:0;width:100%;max-width:100%;padding-right:calc(var(--bs-gutter-x) * .5);padding-left:calc(var(--bs-gutter-x) * .5);margin-top:var(--bs-gutter-y)}.col{flex:1 0 0%}.col-12{flex:0 0 auto;width:100%}@media (min-width:768px){.col-md-6{flex:0 0 auto;width:50%}.col-md-12{flex:0 0 auto;width:100%}}@media (min-width:992px){.col-lg-3{flex:0 0 auto;width:25%}.col-lg-4{flex:0 0 auto;width:33.33333333%}.col-lg-5{flex:0 0 auto;width:41.66666667%}.col-lg-6{flex:0 0 auto;width:50%}.col-lg-7{flex:0 0 auto;width:58.33333333%}.col-lg-8{flex:0 0 auto;width:66.66666667%}}.table{--bs-table-bg:transparent;--bs-table-accent-bg:transparent;--bs-table-striped-color:#212529;--bs-table-striped-bg:rgba(0, 0, 0, 0.05);--bs-table-active-color:#212529;--bs-table-active-bg:rgba(0, 0, 0, 0.1);--bs-table-hover-color:#212529;--bs-table-hover-bg:rgba(0, 0, 0, 0.075);width:100%;margin-bottom:1rem;color:#212529;vertical-align:top;border-color:#dee2e6}.table>:not(caption)>*>*{padding:.5rem;background-color:var(--bs-table-bg);border-bottom-width:1px;box-shadow:inset 0 0 0 9999px var(--bs-table-accent-bg)}.table>:not(:first-child){border-top:2px solid currentColor}.fade{transition:opacity .15s linear}@media (prefers-reduced-motion:reduce){.fade{transition:none}}.fade:not(.show){opacity:0}.collapse:not(.show){display:none}.collapsing{height:0;overflow:hidden;transition:height .35s}.collapsing.collapse-horizontal{width:0;height:auto;transition:width .35s}@media (prefers-reduced-motion:reduce){.collapsing,.collapsing.collapse-horizontal{transition:none}}.dropdown,.dropend,.dropstart,.dropup{position:relative}.dropdown-toggle{white-space:nowrap}.dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:.3em solid;border-right:.3em solid transparent;border-bottom:0;border-left:.3em solid transparent}.dropdown-toggle:empty::after{margin-left:0}.dropdown-menu{position:absolute;z-index:1000;display:none;min-width:10rem;padding:.5rem 0;margin:0;font-size:1rem;color:#212529;text-align:left;list-style:none;background-color:#fff;background-clip:padding-box;border:1px solid rgba(0,0,0,.15);border-radius:.25rem}.dropdown-menu-start{--bs-position:start}.dropdown-menu-end{--bs-position:end}@media (min-width:576px){.dropdown-menu-sm-start{--bs-position:start}.dropdown-menu-sm-end{--bs-position:end}}@media (min-width:768px){.dropdown-menu-md-start{--bs-position:start}.dropdown-menu-md-end{--bs-position:end}}@media (min-width:992px){.dropdown-menu-lg-start{--bs-position:start}.dropdown-menu-lg-end{--bs-position:end}}@media (min-width:1200px){.dropdown-menu-xl-start{--bs-position:start}.dropdown-menu-xl-end{--bs-position:end}}@media (min-width:1400px){.dropdown-menu-xxl-start{--bs-position:start}.dropdown-menu-xxl-end{--bs-position:end}}.dropup .dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:0;border-right:.3em solid transparent;border-bottom:.3em solid;border-left:.3em solid transparent}.dropup .dropdown-toggle:empty::after{margin-left:0}.dropend .dropdown-toggle::after{display:inline-block;margin-left:.255em;content:"";border-top:.3em solid transparent;border-right:0;border-bottom:.3em solid transparent;border-left:.3em solid;vertical-align:0}.dropend .dropdown-toggle:empty::after{margin-left:0}.dropstart .dropdown-toggle::after{margin-left:.255em;vertical-align:.255em;content:"";display:none}.dropstart .dropdown-toggle::before{display:inline-block;margin-right:.255em;content:"";border-top:.3em solid transparent;border-right:.3em solid;border-bottom:.3em solid transparent;vertical-align:0}.dropstart .dropdown-toggle:empty::after{margin-left:0}.dropdown-divider{height:0;margin:.5rem 0;overflow:hidden;border-top:1px solid rgba(0,0,0,.15)}.dropdown-item{display:block;width:100%;padding:.25rem 1rem;clear:both;font-weight:400;color:#212529;text-align:inherit;text-decoration:none;white-space:nowrap;background-color:transparent;border:0}.dropdown-item:focus,.dropdown-item:hover{color:#1e2125;background-color:#e9ecef}.dropdown-item.active,.dropdown-item:active{color:#fff;text-decoration:none;background-color:#0d6efd}.dropdown-item.disabled,.dropdown-item:disabled{color:#adb5bd;pointer-events:none;background-color:transparent}.dropdown-menu.show{display:block}.dropdown-header{display:block;padding:.5rem 1rem;margin-bottom:0;font-size:.875rem;color:#6c757d;white-space:nowrap}.dropdown-item-text{display:block;padding:.25rem 1rem;color:#212529}.dropdown-menu-dark{color:#dee2e6;background-color:#343a40;border-color:rgba(0,0,0,.15)}.dropdown-menu-dark .dropdown-item{color:#dee2e6}.dropdown-menu-dark .dropdown-item:focus,.dropdown-menu-dark .dropdown-item:hover{color:#fff;background-color:rgba(255,255,255,.15)}.dropdown-menu-dark .dropdown-item.active,.dropdown-menu-dark .dropdown-item:active{color:#fff;background-color:#0d6efd}.dropdown-menu-dark .dropdown-item.disabled,.dropdown-menu-dark .dropdown-item:disabled{color:#adb5bd}.dropdown-menu-dark .dropdown-divider{border-color:rgba(0,0,0,.15)}.dropdown-menu-dark .dropdown-item-text{color:#dee2e6}.dropdown-menu-dark .dropdown-header{color:#adb5bd}.dropdown-toggle-split{padding-right:.5625rem;padding-left:.5625rem}.dropdown-toggle-split::after,.dropend .dropdown-toggle-split::after,.dropup .dropdown-toggle-split::after{margin-left:0}.dropstart .dropdown-toggle-split::before{margin-right:0}.nav{display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none}.nav-link{display:block;padding:.5rem 1rem;color:#0d6efd;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out}@media (prefers-reduced-motion:reduce){.nav-link{transition:none}}.nav-link:focus,.nav-link:hover{color:#0a58ca}.nav-link.disabled{color:#6c757d;pointer-events:none;cursor:default}.navbar{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding-top:.5rem;padding-bottom:.5rem}.navbar>.container{display:flex;flex-wrap:inherit;align-items:center;justify-content:space-between}.navbar-nav{display:flex;flex-direction:column;padding-left:0;margin-bottom:0;list-style:none}.navbar-nav .nav-link{padding-right:0;padding-left:0}.navbar-nav .dropdown-menu{position:static}.card{position:relative;display:flex;flex-direction:column;min-width:0;word-wrap:break-word;background-color:#fff;background-clip:border-box;border:1px solid rgba(0,0,0,.125);border-radius:.25rem}.card>hr{margin-right:0;margin-left:0}.card>.list-group{border-top:inherit;border-bottom:inherit}.card>.list-group:first-child{border-top-width:0;border-top-left-radius:calc(.25rem - 1px);border-top-right-radius:calc(.25rem - 1px)}.card>.list-group:last-child{border-bottom-width:0;border-bottom-right-radius:calc(.25rem - 1px);border-bottom-left-radius:calc(.25rem - 1px)}.card-body{flex:1 1 auto;padding:1rem}.card-title{margin-bottom:.5rem}.card-subtitle{margin-top:-.25rem;margin-bottom:0}.card-text:last-child{margin-bottom:0}.accordion-button{position:relative;display:flex;align-items:center;width:100%;padding:1rem 1.25rem;font-size:1rem;color:#212529;text-align:left;background-color:#fff;border:0;border-radius:0;overflow-anchor:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,border-radius .15s}.accordion-button:not(.collapsed){color:#0c63e;background-color:#e7f1ff;box-shadow:inset 0 -1px 0 rgba(0,0,0,.125)}.accordion-button:not(.collapsed)::after{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23FFFFFF'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");transform:rotate(-180deg)}.accordion-button::after{flex-shrink:0;width:1.25rem;height:1.25rem;margin-left:auto;content:"";background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23FFFFFF'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");background-repeat:no-repeat;background-size:1.25rem;transition:transform .2s ease-in-out}.accordion-button:hover{z-index:2}.accordion-button:focus{z-index:3;border-color:#fff;outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}.accordion-header{margin-bottom:0}.accordion-item{background-color:#fff;border:1px solid rgba(0,0,0,.125)}.accordion-item:first-of-type{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.accordion-item:first-of-type .accordion-button{border-top-left-radius:calc(.25rem - 1px);border-top-right-radius:calc(.25rem - 1px)}.accordion-item:not(:first-of-type){border-top:0}.accordion-item:last-of-type{border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.accordion-item:last-of-type .accordion-button.collapsed{border-bottom-right-radius:calc(.25rem - 1px);border-bottom-left-radius:calc(.25rem - 1px)}.accordion-item:last-of-type .accordion-collapse{border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.accordion-body{padding:1rem 1.25rem}.accordion-flush .accordion-collapse{border-width:0}.accordion-flush .accordion-item{border-right:0;border-left:0;border-radius:0}.accordion-flush .accordion-item:first-child{border-top:0}.accordion-flush .accordion-item:last-child{border-bottom:0}.accordion-flush .accordion-item .accordion-button{border-radius:0}.alert{position:relative;padding:1rem;margin-bottom:1rem;border:1px solid transparent;border-radius:.25rem}@-webkit-keyframes progress-bar-stripes{0%{background-position-x:1rem}}@keyframes progress-bar-stripes{0%{background-position-x:1rem}}.progress{display:flex;height:1rem;overflow:hidden;font-size:.75rem;background-color:#e9ecef;border-radius:.25rem}.list-group{display:flex;flex-direction:column;padding-left:0;margin-bottom:0;border-radius:.25rem}.list-group-item{position:relative;display:block;padding:.5rem 1rem;color:#212529;text-decoration:none;background-color:#fff;border:1px solid rgba(0,0,0,.125)}.list-group-item:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.list-group-item:last-child{border-bottom-right-radius:inherit;border-bottom-left-radius:inherit}.list-group-item.disabled,.list-group-item:disabled{color:#6c757d;pointer-events:none;background-color:#fff}.list-group-item.active{z-index:2;color:#fff;background-color:#0d6efd;border-color:#0d6efd}.list-group-item+.list-group-item{border-top-width:0}.list-group-item+.list-group-item.active{margin-top:-1px;border-top-width:1px}.toast{width:350px;max-width:100%;font-size:.875rem;pointer-events:auto;background-color:rgba(255,255,255,.85);background-clip:padding-box;border:1px solid rgba(0,0,0,.1);box-shadow:0 .5rem 1rem rgba(0,0,0,.15);border-radius:.25rem}.toast.showing{opacity:0}.toast:not(.show){display:none}.modal{position:fixed;top:0;left:0;z-index:1055;display:none;width:100%;height:100%;overflow-x:hidden;overflow-y:auto;outline:0}.modal-dialog{position:relative;width:auto;margin:.5rem;pointer-events:none}.modal.fade .modal-dialog{transition:transform .3s ease-out;transform:translate(0,-50px)}@media (prefers-reduced-motion:reduce){.accordion-button,.accordion-button::after,.modal.fade .modal-dialog{transition:none}}.modal.show .modal-dialog{transform:none}.modal.modal-static .modal-dialog{transform:scale(1.02)}.modal-dialog-scrollable{height:calc(100% - 1rem)}.modal-dialog-scrollable .modal-content{max-height:100%;overflow:hidden}.modal-dialog-scrollable .modal-body{overflow-y:auto}.modal-dialog-centered{display:flex;align-items:center;min-height:calc(100% - 1rem)}.modal-content{position:relative;display:flex;flex-direction:column;width:100%;pointer-events:auto;background-color:#fff;background-clip:padding-box;border:1px solid rgba(0,0,0,.2);border-radius:.3rem;outline:0}.modal-backdrop{position:fixed;top:0;left:0;z-index:1050;width:100vw;height:100vh;background-color:#000}.modal-backdrop.fade{opacity:0}.modal-backdrop.show{opacity:.5}.modal-header{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;padding:1rem;border-bottom:1px solid #dee2e6;border-top-left-radius:calc(.3rem - 1px);border-top-right-radius:calc(.3rem - 1px)}.modal-title{margin-bottom:0;line-height:1.5}.modal-body{position:relative;flex:1 1 auto;padding:1rem}.modal-footer{display:flex;flex-wrap:wrap;flex-shrink:0;align-items:center;justify-content:flex-end;padding:.75rem;border-top:1px solid #dee2e6;border-bottom-right-radius:calc(.3rem - 1px);border-bottom-left-radius:calc(.3rem - 1px)}.modal-footer>*{margin:.25rem}@media (min-width:576px){.modal-dialog{max-width:500px;margin:1.75rem auto}.modal-dialog-scrollable{height:calc(100% - 3.5rem)}.modal-dialog-centered{min-height:calc(100% - 3.5rem)}.modal-sm{max-width:300px}}@media (min-width:992px){.modal-lg,.modal-xl{max-width:800px}}@media (min-width:1200px){.modal-xl{max-width:1140px}}.modal-fullscreen{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen .modal-header{border-radius:0}.modal-fullscreen .modal-body{overflow-y:auto}.modal-fullscreen .modal-footer{border-radius:0}@media (max-width:575.98px){.modal-fullscreen-sm-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-sm-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-sm-down .modal-header{border-radius:0}.modal-fullscreen-sm-down .modal-body{overflow-y:auto}.modal-fullscreen-sm-down .modal-footer{border-radius:0}}@media (max-width:767.98px){.modal-fullscreen-md-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-md-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-md-down .modal-header{border-radius:0}.modal-fullscreen-md-down .modal-body{overflow-y:auto}.modal-fullscreen-md-down .modal-footer{border-radius:0}}@media (max-width:991.98px){.modal-fullscreen-lg-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-lg-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-lg-down .modal-header{border-radius:0}.modal-fullscreen-lg-down .modal-body{overflow-y:auto}.modal-fullscreen-lg-down .modal-footer{border-radius:0}}@media (max-width:1199.98px){.modal-fullscreen-xl-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-xl-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-xl-down .modal-header{border-radius:0}.modal-fullscreen-xl-down .modal-body{overflow-y:auto}.modal-fullscreen-xl-down .modal-footer{border-radius:0}}@media (max-width:1399.98px){.modal-fullscreen-xxl-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-xxl-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-xxl-down .modal-header{border-radius:0}.modal-fullscreen-xxl-down .modal-body{overflow-y:auto}.modal-fullscreen-xxl-down .modal-footer{border-radius:0}}.tooltip{position:absolute;z-index:1080;display:block;margin:0;font-family:var(--bs-font-sans-serif);font-style:normal;font-weight:400;line-height:1.5;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;word-break:normal;word-spacing:normal;white-space:normal;line-break:auto;font-size:.875rem;word-wrap:break-word;opacity:0}.tooltip.show{opacity:.9}.tooltip .tooltip-arrow{position:absolute;display:block;width:.8rem;height:.4rem}.tooltip .tooltip-arrow::before{position:absolute;content:"";border-color:transparent;border-style:solid}.bs-tooltip-auto[data-popper-placement^=top],.bs-tooltip-top{padding:.4rem 0}.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow,.bs-tooltip-top .tooltip-arrow{bottom:0}.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before,.bs-tooltip-top .tooltip-arrow::before{top:-1px;border-width:.4rem .4rem 0;border-top-color:#000}.bs-tooltip-auto[data-popper-placement^=right],.bs-tooltip-end{padding:0 .4rem}.bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow,.bs-tooltip-end .tooltip-arrow{left:0;width:.4rem;height:.8rem}.bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow::before,.bs-tooltip-end .tooltip-arrow::before{right:-1px;border-width:.4rem .4rem .4rem 0;border-right-color:#000}.bs-tooltip-auto[data-popper-placement^=bottom],.bs-tooltip-bottom{padding:.4rem 0}.bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow,.bs-tooltip-bottom .tooltip-arrow{top:0}.bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow::before,.bs-tooltip-bottom .tooltip-arrow::before{bottom:-1px;border-width:0 .4rem .4rem;border-bottom-color:#000}.bs-tooltip-auto[data-popper-placement^=left],.bs-tooltip-start{padding:0 .4rem}.bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow,.bs-tooltip-start .tooltip-arrow{right:0;width:.4rem;height:.8rem}.bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow::before,.bs-tooltip-start .tooltip-arrow::before{left:-1px;border-width:.4rem 0 .4rem .4rem;border-left-color:#000}.tooltip-inner{max-width:200px;padding:.25rem .5rem;color:#fff;text-align:center;background-color:#000;border-radius:.25rem}.popover{position:absolute;top:0;left:0;z-index:1070;display:block;max-width:276px;font-family:var(--bs-font-sans-serif);font-style:normal;font-weight:400;line-height:1.5;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;word-break:normal;word-spacing:normal;white-space:normal;line-break:auto;font-size:.875rem;word-wrap:break-word;background-color:#fff;background-clip:padding-box;border:1px solid rgba(0,0,0,.2);border-radius:.3rem}.popover .popover-arrow{position:absolute;display:block;width:1rem;height:.5rem}.popover .popover-arrow::after,.popover .popover-arrow::before{position:absolute;display:block;content:"";border-color:transparent;border-style:solid}.bs-popover-auto[data-popper-placement^=top]>.popover-arrow,.bs-popover-top>.popover-arrow{bottom:calc(-.5rem - 1px)}.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::before,.bs-popover-top>.popover-arrow::before{bottom:0;border-width:.5rem .5rem 0;border-top-color:rgba(0,0,0,.25)}.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::after,.bs-popover-top>.popover-arrow::after{bottom:1px;border-width:.5rem .5rem 0;border-top-color:#fff}.bs-popover-auto[data-popper-placement^=right]>.popover-arrow,.bs-popover-end>.popover-arrow{left:calc(-.5rem - 1px);width:.5rem;height:1rem}.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::before,.bs-popover-end>.popover-arrow::before{left:0;border-width:.5rem .5rem .5rem 0;border-right-color:rgba(0,0,0,.25)}.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::after,.bs-popover-end>.popover-arrow::after{left:1px;border-width:.5rem .5rem .5rem 0;border-right-color:#fff}.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow,.bs-popover-bottom>.popover-arrow{top:calc(-.5rem - 1px)}.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::before,.bs-popover-bottom>.popover-arrow::before{top:0;border-width:0 .5rem .5rem;border-bottom-color:rgba(0,0,0,.25)}.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::after,.bs-popover-bottom>.popover-arrow::after{top:1px;border-width:0 .5rem .5rem;border-bottom-color:#fff}.bs-popover-auto[data-popper-placement^=bottom] .popover-header::before,.bs-popover-bottom .popover-header::before{position:absolute;top:0;left:50%;display:block;width:1rem;margin-left:-.5rem;content:"";border-bottom:1px solid #f0f0f0}.bs-popover-auto[data-popper-placement^=left]>.popover-arrow,.bs-popover-start>.popover-arrow{right:calc(-.5rem - 1px);width:.5rem;height:1rem}.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::before,.bs-popover-start>.popover-arrow::before{right:0;border-width:.5rem 0 .5rem .5rem;border-left-color:rgba(0,0,0,.25)}.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::after,.bs-popover-start>.popover-arrow::after{right:1px;border-width:.5rem 0 .5rem .5rem;border-left-color:#fff}.popover-header{padding:.5rem 1rem;margin-bottom:0;font-size:1rem;background-color:#f0f0f0;border-bottom:1px solid rgba(0,0,0,.2);border-top-left-radius:calc(.3rem - 1px);border-top-right-radius:calc(.3rem - 1px)}.popover-header:empty{display:none}.popover-body{padding:1rem;color:#212529}.carousel{position:relative}.carousel.pointer-event{touch-action:pan-y}.carousel-inner{position:relative;width:100%;overflow:hidden}.carousel-inner::after{display:block;clear:both;content:""}.carousel-item{position:relative;display:none;float:left;width:100%;margin-right:-100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:transform .6s ease-in-out}.carousel-item-next,.carousel-item-prev,.carousel-item.active{display:block}.active.carousel-item-end,.carousel-item-next:not(.carousel-item-start){transform:translateX(100%)}.active.carousel-item-start,.carousel-item-prev:not(.carousel-item-end){transform:translateX(-100%)}.carousel-fade .carousel-item{opacity:0;transition-property:opacity;transform:none}.carousel-fade .carousel-item-next.carousel-item-start,.carousel-fade .carousel-item-prev.carousel-item-end,.carousel-fade .carousel-item.active{z-index:1;opacity:1}.carousel-fade .active.carousel-item-end,.carousel-fade .active.carousel-item-start{z-index:0;opacity:0;transition:opacity 0s .6s}@media (prefers-reduced-motion:reduce){.carousel-fade .active.carousel-item-end,.carousel-fade .active.carousel-item-start,.carousel-item{transition:none}}.carousel-control-next,.carousel-control-prev{position:absolute;top:0;bottom:0;z-index:1;display:flex;align-items:center;justify-content:center;width:15%;padding:0;color:#fff;text-align:center;background:0 0;border:0;opacity:.5;transition:opacity .15s}.carousel-control-next:focus,.carousel-control-next:hover,.carousel-control-prev:focus,.carousel-control-prev:hover{color:#fff;text-decoration:none;outline:0;opacity:.9}.carousel-control-prev{left:0}.carousel-control-next{right:0}.carousel-control-next-icon,.carousel-control-prev-icon{display:inline-block;width:2rem;height:2rem;background-repeat:no-repeat;background-position:50%;background-size:100% 100%}.carousel-control-prev-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e")}.carousel-control-next-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")}.carousel-indicators{position:absolute;right:0;bottom:0;left:0;z-index:2;display:flex;justify-content:center;padding:0;margin-right:15%;margin-bottom:1rem;margin-left:15%;list-style:none}.carousel-indicators [data-bs-target]{box-sizing:content-box;flex:0 1 auto;width:30px;height:3px;padding:0;margin-right:3px;margin-left:3px;text-indent:-999px;cursor:pointer;background-color:#fff;background-clip:padding-box;border:0;border-top:10px solid transparent;border-bottom:10px solid transparent;opacity:.5;transition:opacity .6s}@media (prefers-reduced-motion:reduce){.carousel-control-next,.carousel-control-prev,.carousel-indicators [data-bs-target]{transition:none}}.carousel-indicators .active{opacity:1}.carousel-caption{position:absolute;right:15%;bottom:1.25rem;left:15%;padding-top:1.25rem;padding-bottom:1.25rem;color:#fff;text-align:center}.carousel-dark .carousel-control-next-icon,.carousel-dark .carousel-control-prev-icon{filter:invert(1) grayscale(100)}.carousel-dark .carousel-indicators [data-bs-target]{background-color:#000}.carousel-dark .carousel-caption{color:#000}@-webkit-keyframes spinner-border{to{transform:rotate(360deg)}}@keyframes spinner-border{to{transform:rotate(360deg)}}@-webkit-keyframes spinner-grow{0%{transform:scale(0)}50%{opacity:1;transform:none}}@keyframes spinner-grow{0%{transform:scale(0)}50%{opacity:1;transform:none}}.offcanvas{position:fixed;bottom:0;z-index:1045;display:flex;flex-direction:column;max-width:100%;visibility:hidden;background-color:#fff;background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}@media (prefers-reduced-motion:reduce){.offcanvas{transition:none}}.offcanvas-backdrop{position:fixed;top:0;left:0;z-index:1040;width:100vw;height:100vh;background-color:#000}.offcanvas-backdrop.fade{opacity:0}.offcanvas-backdrop.show{opacity:.5}.offcanvas-header{display:flex;align-items:center;justify-content:space-between;padding:1rem}.offcanvas-title{margin-bottom:0;line-height:1.5}.offcanvas-body{flex-grow:1;padding:1rem;overflow-y:auto}.offcanvas-start{top:0;left:0;width:400px;border-right:1px solid rgba(0,0,0,.2);transform:translateX(-100%)}.offcanvas-end{top:0;right:0;width:400px;border-left:1px solid rgba(0,0,0,.2);transform:translateX(100%)}.offcanvas-top{top:0;right:0;left:0;height:30vh;max-height:100%;border-bottom:1px solid rgba(0,0,0,.2);transform:translateY(-100%)}.offcanvas-bottom{right:0;left:0;height:30vh;max-height:100%;border-top:1px solid rgba(0,0,0,.2);transform:translateY(100%)}.offcanvas.show{transform:none}@-webkit-keyframes placeholder-glow{50%{opacity:.2}}@keyframes placeholder-glow{50%{opacity:.2}}@-webkit-keyframes placeholder-wave{100%{-webkit-mask-position:-200% 0%;mask-position:-200% 0%}}@keyframes placeholder-wave{100%{-webkit-mask-position:-200% 0%;mask-position:-200% 0%}}.fixed-top{position:fixed;top:0;right:0;left:0;z-index:1030}.fixed-bottom{position:fixed;right:0;bottom:0;left:0;z-index:1030}.sticky-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}.visually-hidden,.visually-hidden-focusable:not(:focus):not(:focus-within){position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.d-block{display:block!important}.d-flex{display:flex!important}.w-100{width:100%!important}.flex-fill{flex:1 1 auto!important}.flex-column{flex-direction:column!important}.justify-content-center{justify-content:center!important}.justify-content-between{justify-content:space-between!important}.align-items-center{align-items:center!important}.align-items-stretch{align-items:stretch!important}.align-self-start{align-self:flex-start!important}.mt-4{margin-top:1.5rem!important}.mb-0{margin-bottom:0!important}.pb-4{padding-bottom:1.5rem!important}.text-muted{--bs-text-opacity:1;color:#6c757d!important}.visible{visibility:visible!important}

/* site styles */
/* fonts (local, css/font) */

@font-face {
	font-family: "Work Sans";
	src: url("font/Work_Sans/WorkSans-VariableFont_wght.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Work Sans";
	src: url("font/Work_Sans/WorkSans-Italic-VariableFont_wght.woff2") format("woff2");
	font-weight: 100 900;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-Thin.woff2") format("woff2");
	font-weight: 100;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-ThinItalic.woff2") format("woff2");
	font-weight: 100;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-ExtraLight.woff2") format("woff2");
	font-weight: 200;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-ExtraLightItalic.woff2") format("woff2");
	font-weight: 200;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-Light.woff2") format("woff2");
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-LightItalic.woff2") format("woff2");
	font-weight: 300;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-Regular.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-Italic.woff2") format("woff2");
	font-weight: 400;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-Medium.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-MediumItalic.woff2") format("woff2");
	font-weight: 500;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-SemiBold.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-SemiBoldItalic.woff2") format("woff2");
	font-weight: 600;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-Bold.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-BoldItalic.woff2") format("woff2");
	font-weight: 700;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-ExtraBold.woff2") format("woff2");
	font-weight: 800;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-ExtraBoldItalic.woff2") format("woff2");
	font-weight: 800;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-Black.woff2") format("woff2");
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("font/Barlow/Barlow-BlackItalic.woff2") format("woff2");
	font-weight: 900;
	font-style: italic;
	font-display: swap;
}

/* Noto Sans (regular) for small subtitles; latin + latin-ext subsets */
@font-face {
	font-family: "Noto Sans";
	src: url("font/Noto_Sans/noto-sans-latin-ext-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: "Noto Sans";
	src: url("font/Noto_Sans/noto-sans-latin-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* general */

/* desktop content width: 1200px (+ 2 x 12px container padding) */
@media (min-width: 1200px) {
	.container {
		max-width: 1224px;
	}
}

/* SVG icons (img/icons), inlined so they take the text colour */
.icon {
	display: inline-block;
	width: 1.25em;
	height: 1.25em;
	vertical-align: -0.25em;
	fill: currentColor;
	flex-shrink: 0;
}

body {
	font-family: "Barlow", sans-serif;
	color: #4d4d4d;
	font-size: 16px;
	line-height: 1.6em;
	font-weight: 300;
}
/* body text: 16px on desktop, 14px on tablet and mobile */
@media (max-width: 1023.98px) {
	body {
		font-size: 14px;
	}
}

.skip-link {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.skip-link:focus {
  position: static; /* bring into view */
  width: auto;
  height: auto;
  padding: 8px;
  background: #005fcc;
  color: white;
  font-weight: bold;
  z-index: 1000; /* on top */
}

/* Show outline when elements are focused (keyboard navigation).
   Solid outline meets 3:1 contrast and survives forced-colors mode; glow is decorative. */
:focus-visible {
  outline: 2px solid #67267a;
  outline-offset: 2px;
  box-shadow: 0 0 6px 3px rgba(255, 143, 66, 0.7);
}
/* links: three solid rings, white / orange / purple from the inside out.
   Transparent outline turns into a visible system-colour ring in forced-colors mode,
   where box-shadow is dropped. Low specificity so pill buttons keep their radius */
a:focus-visible {
  border-radius: 4px;
  outline: 2px solid transparent;
  outline-offset: 0;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #ff8f42, 0 0 0 6px #67267a;
}

a {
	color: #67267a;
	text-decoration: none;
}

a:hover {
	color: #ff8f42;
	text-decoration: none;
}

/* links inside running text stay underlined so they don't rely on colour alone (WCAG 1.4.1) */
.card-text a, h2 a, #about .tl-sub a, #about .tl-item li a, .accordion-body a, a.text-link {
	text-decoration: underline;
}

h1, h2, h3, h4, h5, h6, p, .card-subtitle, .smallsubtitle {
	font-family: "Barlow", sans-serif;
	font-weight: 300;
}
h1, h2, h3, h4, h5, h6 {
	font-family: "Work Sans", sans-serif;
}
h1, h2, h3, .h3, h4, .h4 {
	text-align: left;
}
h1, h2, h1.h2 {
	font-size: 32px;
	line-height: 1.45em;
}
/* section headings, as in the new design */
h2 {
	color: #4d4d4d;
	font-weight: 400;
	margin-bottom: 16px;
}
h1 {
	color: #3f3f3f;
	font-weight: 500;
	margin-bottom: 24px;
}
/* heading level set for the outline, look kept from the old tag (.h2/.h3/.h4/.h5) */
h1.h2 {
	color: #4d4d4d;
	font-weight: 400;
	margin-top: 0;
	margin-bottom: 16px;
}
h3, .h3, h4, .h4 {
	color: #67267a;
	line-height: 1.2em;
	font-weight: 400;
}
h3, .h3 {
	margin-bottom: 12px;
}
h3, .h3 {
	font-size: 24px;
}
.smallsubtitle {
	font-size: 20px;
}
h4, .h4 {
	font-size: 20px;
	margin-bottom: 4px;
}
.h4.card-title {
	margin-bottom: .5rem;
}
h2.h5 {
	font-weight: 300;
	text-align: start;
}
/* heading scale: desktop / 1024 / 428 */
@media (max-width: 1024px) {
	h1 {
		font-size: 28px;
	}
	h2, h1.h2 {
		font-size: 24px;
	}
	h3, .h3 {
		font-size: 20px;
	}
	h4, .h4, .smallsubtitle {
		font-size: 16px;
	}
}
@media (max-width: 428px) {
	h1 {
		font-size: 24px;
		margin-top: 12px;
		margin-bottom: 12px;
	}
	h2, h1.h2 {
		font-size: 20px;
	}
}
p {
	hyphens: auto;
	hyphenate-limit-chars: 10 3 4;
}
.smallsubtitle {
  font-family: "Noto Sans", sans-serif;
  color: #67267a;
  line-height: 1.2em;
  text-align: left;
  margin-bottom: 8px;
  font-weight: 400;
}
strong {
	font-weight: 500;
}

/* line breaks per screen size */
@media (min-width: 429px) {
	.phone-br {
		display: none;
	}
}
@media (min-width: 745px) {
	.mobile-br {
		display: none;
	}
}
@media (min-width: 1000px) {
	.tablet-br {
		display: none;
	}
}
@media (max-width: 428px) {
	.desktop-br {
		display: none;
	}
	body {
		font-size: 14px;
		line-height: 1.5em;
	}
}

/* top bar */
#topbar {
	font-size: 14px;
	background: linear-gradient(180deg, rgba(230,230,230,1) 0%, rgba(255,255,255,1) 100%);
	padding: 6px 0;
}
#topbar .container{
	display: flex;
	justify-content: space-between;
}
#topbar .contact {
  	flex: 1 1 0;
  	min-width: 0;
  	display: flex;
  	align-items: center;  
}
#topbar .contact-left {
  	justify-content: flex-start;  
}
#topbar .contact-center {
  	justify-content: center;      
}
#topbar .contact-right {
  	justify-content: flex-end;  
}
#topbar .contact-left {
	gap: 24px;
}
#topbar .contact a {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: #4d4d4d;
	line-height: 1;
	transition: 0.3s;
}
#topbar .contact a:hover {
	color: #ff8f42;
}
#topbar .icon {
	width: 24px;
	height: 24px;
	color: #67267a;
	vertical-align: middle;
}
#topbar .socialmedia {
	display: flex;
	gap: 24px;
}
#topbar .socialmedia a:hover .icon {
	color: #ff8f42;
}

/* language switch: two pills, the active one filled */
#topbar .contact-right {
	gap: 8px;
}
#topbar .contact-right .language {
	display: inline-block;
	min-width: 0;
	height: auto;
	margin: 0;
	padding: 2px 9px;
	border: none;
	border-radius: 20px;
	background-color: #fff;
	font-weight: 400;
	line-height: 20px;
	color: #67267a;
	cursor: pointer;
}
#topbar .contact-right .language:hover {
	background-color: #ff8f42;
	color: #fff;
}
#topbar .contact-right .language[aria-current],
#topbar .contact-right .language[aria-current]:hover {
	background-color: #67267a;
	color: #fff;
	cursor: default;
}

@media (max-width:1024px){
	#topbar .contact .mobile-hidden {
		display: none;
	}
}

/* header */
#header {
	transition: all 0.5s;
	z-index: 997;
	background: #FFFFFF;
	box-shadow: 0px 8px 8px 0px rgba(0, 0, 0, 0.1);
	padding: 8px 0 0 0;
}
#header .logo {
	align-content: center;
}
#header .heading1,
#header .heading2 {
	font-family: "Barlow", sans-serif;
}
#header .heading1 {
	font-size: 20px;
	margin: 12px 0px 4px 8px;
	line-height: 1;
	font-weight: 400;
	letter-spacing: 0.5px;
}
/* logo, name and role are one link to the start page (one 2.5.8-sized target instead of two thin ones) */
#header .logo-link {
	display: flex; /* logo beside the two text lines, same geometry as the old float */
	align-items: flex-start;
	width: fit-content;
	text-decoration: none;
}
#header .heading1 {
	color: #67267a;
}
#header .heading2 {
	font-size: inherit;
	margin: 0px 0px 12px 8px;
	line-height: 1;
	font-weight: 300;
	color: #4d4d4d;
}
#header .logo img {
	margin-right: 0;
	max-height: 72px;
	width: auto; /* keeps the ratio now that the img has width/height attributes */
	float: left;
}
@media (max-width:700px){
	#header .container {
		padding-left: 0px;
	}
	#header .heading1 {
		font-size: 14px;
		margin: 12px 0px 4px 8px;
		line-height: 1;
		font-weight: 400;
	}
	#header .heading2 {
		font-size: 12px;
		margin: 0px 0px 12px 8px;
		line-height: 1;
		font-weight: 400;
	}
	#header .logo img {
	margin-right: 0;
	max-height: 64px;
	float: left;
	}
}

/* desktop header per design: 97px high, 82px logo */
@media (min-width: 992px) {
	#header {
		padding: 10px 0 5px;
	}
	#header .logo img {
		max-height: 82px;
		margin-right: 0;
	}
	#header .heading1 {
		margin: 17px 0 4px 8px;
	}
	#header .heading2 {
		margin-left: 8px;
	}
}

.scrolled-offset {
	margin-top: 70px;
}

/* desktop nav bar */
.navbar {
	padding: 0;
	align-items: center;
}
.navbar ul {
	margin: 0;
	padding: 0;
	display: flex;
	list-style: none;
	align-items: center;
}
.navbar li {
	position: relative;
	font-size: medium;
	font-weight: normal;
	line-height: 1.2em;
}
.navbar a, .navbar a:focus {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 12px;
    padding-right: 0;
    padding-left: 13px;
    padding-bottom: 12px;
    font-size: 16px;
    color: #4d4d4d;
    white-space: nowrap;
    transition: 0.3s;
}
.navbar a .icon, .navbar a:focus .icon {
	width: 24px;
	height: 24px;
}
.navbar .active, .navbar .active:focus {
	color: #67267a;
}
.navbar a:hover, .navbar li:hover > a {
	color: #ff8f42;
}
/* current page: purple + bold, as in the design */
.navbar .active, .navbar .active:focus {
	font-weight: 600;
}
.navbar .getstarted, .navbar .getstarted:focus {
	background: #67267a;
	padding: 8px 20px;
	margin-left: 32px;
	border-radius: 4px;
	color: #fff;
}
.navbar .getstarted:hover, .navbar .getstarted:focus:hover {
	color: #fff;
	background: #67267a;
}
.navbar .dropdown ul {
	display: block;
	position: absolute;
	left: 24px;
	top: calc(100% + 30px);
	margin: 0;
	padding: 12px 0;
	z-index: 99;
	opacity: 0;
	visibility: hidden;
	background: #fff;
	box-shadow: 0px 0px 32px rgba(127, 137, 161, 0.25);
	transition: 0.3s;
}
.navbar .dropdown ul li {
	min-width: 200px;
}
.navbar .dropdown ul a {
	padding: 12px 20px;
	font-size: 15px;
	text-transform: none;
	color: #4d4d4d;
}
.navbar .dropdown ul a i {
	font-size: 15px;
}
.navbar .dropdown ul a:hover, .navbar .dropdown ul .active:hover, .navbar .dropdown ul li:hover > a {
	color: #67267a;
}
.navbar .dropdown:hover > ul {
	opacity: 1;
	top: 100%;
	visibility: visible;
}
.navbar .dropdown .dropdown ul {
	top: 0;
	left: calc(100% - 30px);
	visibility: hidden;
}
.navbar .dropdown .dropdown:hover > ul {
	opacity: 1;
	top: 0;
	left: 100%;
	visibility: visible;
}
@media (max-width: 1366px) {
  	.navbar .dropdown .dropdown ul {
    	left: -90%;
  	}
  	.navbar .dropdown .dropdown:hover > ul {
    	left: -100%;
  	}
}
/* mobile nav bar */
.mobile-nav-toggle {
	padding: 0;
	border: 0;
	background: none;
	color: #4d4d4d;
	font-size: 28px;
	cursor: pointer;
	display: none;
	line-height: 0;
	transition: 0.5s;
}
.mobile-nav-toggle.is-open {
	color: #fff;
}
.mobile-nav-toggle .icon-close,
.mobile-nav-toggle.is-open .icon-menu {
	display: none;
}
.mobile-nav-toggle.is-open .icon-close {
	display: inline-block;
}

@media (max-width: 991px) {
	.mobile-nav-toggle {
   		display: block;
		color: #67267a;
	}

	.navbar ul {
    	display: none;
	}
}
/* the "Home" text is only shown in the open mobile menu */
.navbar .nav-label {
	display: none;
}
.navbar-mobile {
	position: fixed;
	overflow: hidden;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	background: rgba(59, 59, 59, 0.75);
	transition: 0.3s;
	z-index: 999;
}
/* close button sits exactly where the burger was; --nav-toggle-top / --nav-toggle-right / --nav-top are set in main.js */
.navbar-mobile .mobile-nav-toggle {
	position: absolute;
	top: var(--nav-toggle-top, 20px);
	right: var(--nav-toggle-right, 16px);
	margin: 0;
}
/* white panel directly below the header, only as tall as the menu */
.navbar-mobile ul {
	display: block;
	position: absolute;
	top: var(--nav-top, 72px);
	right: 8px;
	left: 8px;
	max-height: calc(100% - var(--nav-top, 72px) - 8px);
	padding: 4px 0;
	background-color: #fff;
	overflow-y: auto;
	transition: 0.3s;
}
.navbar-mobile a, .navbar-mobile a:focus {
	justify-content: flex-start;
	gap: 8px;
	padding: 8px 13px;
	font-size: 16px;
	line-height: 20px;
	color: #4d4d4d;
}
.navbar-mobile .nav-label {
	display: inline;
}
.navbar-mobile a .icon {
	width: 20px;
	height: 20px;
}
.navbar-mobile .active, .navbar-mobile a:hover, .navbar-mobile li:hover > a {
	color: #67267a;
}
.navbar-mobile a:hover, .navbar-mobile li:hover > a {
	color: #ff8f42;
}
.navbar-mobile .getstarted, .navbar-mobile .getstarted:focus {
	margin: 16px;
}
.navbar-mobile .dropdown ul {
	position: static;
	display: none;
	margin: 12px 20px;
	padding: 12px 0;
	z-index: 99;
	opacity: 1;
	visibility: visible;
	background: #fff;
	box-shadow: 0px 0px 32px rgba(127, 137, 161, 0.25);
}
.navbar-mobile .dropdown ul li {
	min-width: 200px;
}
.navbar-mobile .dropdown ul a {
	padding: 12px 20px;
}
.navbar-mobile .dropdown ul a i {
	font-size: 12px;
}
.navbar-mobile .dropdown ul a:hover, .navbar-mobile .dropdown ul .active:hover, .navbar-mobile .dropdown ul li:hover > a {
	color: #67267a;
}
.navbar-mobile .dropdown > .dropdown-active {
	display: block;
}

/* hero */
#hero {
	/* the picture (6000x1100) keeps its proportions on wide screens; on narrow screens the hero is taller than that and the left side is cropped, the right side (the person) always stays visible */
	background: repeat scroll right center/cover;
	height: 100%;
	padding: 32px 0;
	min-height: 18.3vw; /* = width / (6000/1100): never wider than the picture, so wide screens do not crop the top (face) */
	width: 100%;
}
#hero .hero-content {
	height: auto;
	min-height: 17em;
	width: 60%;
	text-align: left;
	display: flex;
	justify-content: center;
	flex-direction: column;
}
#hero .hero-content h1 {
	font-size: 36px;
	font-weight: 500;
	margin-bottom: 12px;
	text-transform: uppercase;
	color: #ffffff;
}
#hero .hero-content p {
	font-size: 15px;
	letter-spacing: 3px;
	margin-top: 0;
	margin-bottom: 32px;
	text-transform: capitalize;
	color: #4d4d4d;
	font-weight: 500;
}
#hero .hero-content .hero-intro {
	font-size: 22px;
	line-height: 1.15;
	letter-spacing: 0;
	text-transform: none;
	color: #fff;
	font-weight: 400;
	margin: 24px 0 40px;
}
#hero .button {
	align-self: flex-start;
	font-weight: 500;
	font-size: 14px;
	letter-spacing: 1px;
	display: inline-block;
	padding: 12px 24px;
	border-radius: 50px;
	transition: 0.5s;
	line-height: 1;
	text-align: center;
	color: #fff;
	background-color: rgba(103, 38, 122, 0.75);
}
#hero .button:hover {
	background-color: #67267a;
}

@media (max-width: 1081px) {
	#hero .hero-content {
		min-height: 15em;
		width: 75%;
	}
	#hero .hero-content h1 {
		font-size: 24px;
	}
	#hero .hero-content .hero-intro {
		font-size: 16px;
		line-height: 1.25;
		margin: 8px 0 24px;
	}
}
@media (max-width: 768px) {
	#hero .hero-content {
		min-height: 12em;
		align-items: flex-start;
	}
	#hero .hero-content h1 {
		font-size: 20px;
		margin: 12px 0 14px;
	}
	#hero .hero-content p {
		font-size: 11px;
		margin-bottom: 14px;
		line-height: 1.15;
	}
	#hero .hero-content .hero-intro {
		font-size: 13px;
		margin: 0 0 16px;
	}
}
@media (max-width: 428px) {
	#hero .hero-content {
		height: 8em;
		min-height: 0;
		width: 55%;
		margin: 16px 0;
	}
	#hero .hero-content h1 {
		margin: 8px 0 16px;
	}
	#hero .button,
	#hero .mobile {
		display: none;
	}
}
@media (max-width: 400px) {
	#hero .hero-content {
		height: 7em;
		width: 63%;
	}
	#hero .hero-content h1 {
		margin: 8px 8px 16px;
	}
}
/* responsive background images: pick the @size file that fits the displayed width (and 2x for retina) */
#hero {
	background-image: url("../img/Training_Hero@1920.webp");
	background-image: image-set(url("../img/Training_Hero@1920.webp") 1x, url("../img/Training_Hero.webp") 2x);
}
@media (min-width: 1921px) {
	#hero { background-image: image-set(url("../img/Training_Hero.webp") 1x, url("../img/Training_Hero@3840.webp") 2x); }
}
@media (min-width: 2561px) {
	#hero { background-image: url("../img/Training_Hero@3840.webp"); }
}
@media (max-width: 768px) {
	#hero { background-image: image-set(url("../img/Training_Hero@1280.webp") 1x, url("../img/Training_Hero.webp") 2x); }
}
@media (max-width: 428px) {
	#hero { background-image: image-set(url("../img/Training_Hero@844.webp") 1x, url("../img/Training_Hero@1920.webp") 2x); }
}

/* teaser*/
#teaser {
	padding: 32px 0px;
}
/* "Produktentwicklung" is wider than the screen at 320px; let it hyphenate (1.4.10 Reflow) */
:lang(de) #teaser h2 {
	hyphens: auto;
}
#teaser .card {
	border: 0;
	margin-bottom: 32px;
	/* fill the column; otherwise the image card shrinks to the image's
	   natural width when the columns are stacked (tablet/mobile) */
	width: 100%;
}
#teaser .card-body {
	padding: 0px;
	text-align: justify;
	margin-right: 20px;
}
#teaser .card-text {
	line-height: 2.4em;
	text-align: left;
}
#teaser .button {
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 1px;
	display: inline-block;
	padding: 12px 24px;
	border-radius: 50px;
	transition: 0.5s;
	line-height: 1;
	text-align: center;
	color: #fff;
	background-color: #67267a;
}
#teaser .button:hover {
	background-color: #ff8f42;
	color: #fff;
}

#teaser .card .image {
  border: 0;
  height: 100%;
  width: 100%;
  object-fit: cover;
}

@media (max-width:428px) {
	#teaser .card-body {
		margin-right: 0px;
	}
	#teaser .card-text {
		line-height: 1.6em;
	}
	#teaser .smallsubtitle {
		display: none;
	}
}
/* services: "Auf einen Blick" fact cards + "Leistungen" service cards */
#services {
	background-color: #f6f6f6;
	padding: 32px 0px;
}
#services h2{
  	line-height: 1.45em;
  	text-align: left;
}
#services .card {
	width: 100%;
	border: 0;
	border-radius: 0;
	margin-bottom: 16px;
}
#services .card-body {
	padding: 16px;
}
#services .card-text,
#services .card-list {
	line-height: 1.6em;
	color: #4d4d4d;
	hyphens: auto;
}
/* no automatic hyphenation on the English pages */
:lang(en) #services .card-text,
:lang(en) #services .card-list {
	hyphens: manual;
}
#services .card-text a {
	color: #67267a;
}
#services .card-text a:hover {
	color: #ff8f42;
}

/* fact cards */
#services .fact h3 {
	margin: 0 0 20px;
	font-weight: 400;
	line-height: 1.25em;
}
#services .fact-value {
	display: block;
	font-size: 22px;
	color: #67267a;
}
#services .fact-label {
	display: block;
	font-size: 20px;
	color: #8e5a9b;
}
#services .fact .card-text {
	margin: 0;
}

/* service cards with the round icon on the top edge */
#services .service {
	margin-top: 32px;
}
#services .card-icon {
	height: 32px;
	text-align: center;
	margin-top: -32px; /* circle sits half above the card edge */
}
#services .card-icon .background {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	background-color: #fff;
	border-radius: 50%;
	color: #67267a;
}
#services .card-icon .icon {
	width: 28px;
	height: 28px;
}
#services .service .card-body {
	padding-top: 32px; /* start below the icon circle */
}
#services .service .card-title {
	color: #67267a;
  	line-height: 1.2em;
	font-weight: 400;
	margin: 0 0 12px;
}
#services .service .card-text {
	margin-bottom: 16px;
}
#services .card-list {
	margin: -8px 0 16px;
	padding-left: 24px;
}

@media (max-width:1000px) {
  	#services h2{
		margin-top: 0px;
  	}
}
/* process */
/* process: benefit list below the cycle graphic */
:is(#process, #process2) .process-benefits {
	margin-top: 24px;
	line-height: 1.6em;
	color: #4d4d4d;
}
:is(#process, #process2) .process-benefits p {
	margin-bottom: 8px;
}
:is(#process, #process2) .process-benefits ol {
	margin: 0;
	padding-left: 36px; /* 12px row gutter + 24px for the numbers */
}
:is(#process, #process2) .process-benefits li {
	margin-bottom: 8px;
	padding-left: 4px;
}
#process {
	padding: 32px 0px;
}

@media (max-width: 1023.98px) {
  	#process {
		display: none;
  	}
	#process h2{
		margin-bottom: 0px;
		margin-top: 0px;
  	}
}

/* width/height attributes only reserve space; the image scales with its width */
:is(#process, #process2) img,
#partner2 .carousel-item img {
	height: auto;
}
#process2 {
	padding: 0px;
}
#process2 h2 {
  	line-height: 1.45em;
  	text-align: left;
	margin-top: 32px;
}
#process2 h3 {
  	color: #67267a;
  	line-height: 1.2em;
  	margin-bottom: 12px;
	text-align: left;
	font-weight: 400;
}
@media (min-width: 1024px) {
  	#process2 {
		display: none;
  	}
}
/* philosophy */
#philosophy {
	background-color: #f6f6f6;
	padding: 32px 0px;
}
#philosophy .card {
	border: 0;
	border-radius: 0;
	margin-bottom: 32px;
}
#philosophy .card-body {
	padding: 16px;
	display: flex;
	flex-direction: column;
}
/* buttons line up at the bottom of the equal-height cards */
#philosophy .card-body .button {
	margin-top: auto;
	align-self: flex-start;
}
#philosophy .card-title {
	color: #67267a;
	font-weight: 400;
	margin-bottom: 0;
}
#philosophy .smallsubtitle {
	color: #8e5a9b;
	margin-bottom: 20px;
}
#philosophy .card-text {
	line-height: 1.6em;
	color: #4d4d4d;
	margin-bottom: 20px;
}
#philosophy .button {
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 1px;
	display: inline-block;
	padding: 12px 24px ;
	border-radius: 50px;
	transition: 0.5s;
	line-height: 1;
	text-align: center;
	color: #fff;
	background-color: #67267a;
}
#philosophy .button:hover {
	background-color: #ff8f42;
	color: #fff;
}

@media (max-width: 1024px) {
  	#philosophy {
    	background-attachment: scroll;
		margin-top: 32px;
  	}
  	#philosophy h2{
		margin-bottom: 0px;
		margin-top: 0px;
  	}
  	#philosophy .card{
    	margin-top: 20px;
		margin-bottom: 0;
  	}
}

/* client */
#client {
	padding: 32px 0px;
}
#client h2{
}
#client .card {
	border: 0;
	margin-bottom: 32px;
}
#client .card-body {
	padding-top: 12px;
}
#client .card-title {
	font-weight: 700;
	text-align: center;
	padding: 0 4px 20px;
}
#client .card-text {
	color: #5e5e5e;
	padding: 0 4px;
	line-height: 1.45em;
}
#client .partnerlogo{
	text-align: center;
}
#client .card .image {
	border: 0;
	height: 100%;
	width: 100%;
    object-fit: cover;
}
#client .carousel{
	margin-top: 0px;
	margin-bottom: 32px;
}
#client .carousel-item img {
  	margin-right: 4px;
	margin-left: 4px;
}
#client .carousel-indicators {
  bottom: -2.5rem; /* move the indicators below the image */
}
#client .carousel-indicators [data-bs-target] {
  background-color: grey; /* inactive indicators */
}
#client .carousel-indicators .active {
  background-color: darkgrey; /* active indicator */
}

/* native testimonial (picture + text)
   desktop  (>= 1024px, #client):  side-scrolling row, photo 240x360, text box 560x360
   tablet   (768-1023px, #client): side-scrolling row, photo 120x180, text box 260x230 (client) / 260x300 (mentee), tags below
   mobile   (< 768px, #client2):   carousel, same card as tablet */
:is(#client, #client2) .testimonial {
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	width: 380px;
	max-width: 100%;
	margin: 0 auto;
	background-color: #f4f4f4;
}
:is(#client, #client2) .testimonial .testimonial-photo {
	display: block;
	flex: 0 0 120px;
	width: 120px;
	height: 180px;
	margin: 0;
	object-fit: cover;
}
:is(#client, #client2) .testimonial-body {
	display: flex;
	flex-direction: column;
	flex: 1 1 0;
	min-width: 0;
	padding: 6px 8px 8px 12px;
}
:is(#client, #client2) .testimonial--client .testimonial-body {
	min-height: 230px;
}
:is(#client, #client2) .testimonial--mentee .testimonial-body {
	min-height: 300px;
}
:is(#client, #client2) .testimonial-name {
	font-family: "Barlow", sans-serif;
	font-size: 20px;
	color: #4d4d4d;
	font-weight: 400;
	line-height: 1.2em;
	margin: 0 0 4px;
}
:is(#client, #client2) .flag {
	display: inline-block;
	width: 1.1em;
	height: auto;
	margin-left: 4px;
	vertical-align: -0.05em;
}
:is(#client, #client2) .testimonial-role {
	margin: 0 0 14px;
	font-size: 12px;
	line-height: 1.4em;
	color: #4d4d4d;
}
:is(#client, #client2) .testimonial--client .testimonial-role {
	font-size: 13px;
	font-weight: 500;
	line-height: 1.7em;
	margin-top: 4px;
}
:is(#client, #client2) .testimonial-quote {
	margin: 0;
}
:is(#client, #client2) .testimonial-quote p {
	margin: 0;
	font-size: 12px;
	color: #4d4d4d;
	font-weight: 400;
	line-height: 1.35em;
	hyphens: auto;
}
:is(#client, #client2) .testimonial-tags {
	display: flex;
	flex: 1 0 100%;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px 16px;
	margin: 0;
	padding: 8px 12px 20px;
	list-style: none;
}
:is(#client, #client2) .testimonial-tags li {
	padding: 1px 8px;
	border-radius: 999px;
	background-color: #8e5a9b;
	color: #fff;
	font-size: 12px;
	line-height: 1.6em;
	font-weight: 400;
}

/* variant on sub-pages: grey section, white cards (Human First design) */
:is(#client.client--grey) {
	background-color: #f6f6f6;
}
#client.client--grey .testimonial {
	background-color: #fff;
}

/* side-scrolling row (tablet + desktop); runs out to the right edge of the window */
#client {
	overflow-x: clip;
}
#client .testimonial-scroller {
	display: flex;
	gap: 24px;
	flex: 1 1 auto;
	width: auto;
	max-width: none;
	margin-right: calc(50% - 50vw);
	margin-bottom: 32px;
	padding-bottom: 12px;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scroll-padding-left: calc(var(--bs-gutter-x) * .5); /* keep cards aligned with the heading */
	scrollbar-width: thin;
	scrollbar-color: #c9b3d1 transparent;
}
#client .testimonial-scroller .testimonial {
	flex: 0 0 auto;
	margin: 0;
	scroll-snap-align: start;
}

/* desktop card */
@media (min-width: 1024px) {
	#client .testimonial {
		position: relative;
		width: 800px;
		flex-wrap: nowrap;
	}
	#client .testimonial .testimonial-photo {
		flex: 0 0 240px;
		width: 240px;
		height: 360px;
	}
	#client .testimonial .testimonial-body {
		flex: 1 1 560px;
		min-height: 360px;
		padding: 36px 32px 24px;
	}
	#client .testimonial-name {
		font-size: 32px;
	}
	#client .testimonial-role {
		font-size: 14px;
		margin: 0 0 16px;
	}
	#client .testimonial-quote p {
		font-size: 13px;
	}
	#client .testimonial--client .testimonial-body {
		justify-content: center;
	}
	#client .testimonial--client .testimonial-role {
		font-size: 15px;
		margin: 8px 0 32px;
	}
	/* tags sit at the bottom of the text box */
	#client .testimonial--mentee .testimonial-body {
		padding-bottom: 96px;
	}
	#client .testimonial-tags {
		position: absolute;
		left: 272px;
		bottom: 24px;
		max-width: 360px; /* two tags per row, as in the template */
		justify-content: flex-start;
		padding: 0;
	}
	#client .testimonial-tags li {
		font-size: 13px;
	}
}

@media (max-width: 767.98px) {
  	#client {
		display: none;
  	}
}
@media (max-width: 1024px) {
	#client h2{
		margin-bottom: 0px;
		margin-top: 0px;
  	}
}

#client2 {
	padding: 32px 0px;
}
#client2 h2 {
  	line-height: 1.45em;
  	text-align: left;
	margin-top: 0px;
}
#client2 h3 {
  	color: #67267a;
  	line-height: 1.2em;
  	margin-bottom: 12px;
	text-align: left;
	font-weight: 400;
}
#client2 .carousel{
	margin-top: 0px;
	margin-bottom: 32px;
}
#client .carousel-item img{
	width: 100%; 
  	height: auto;
}
#client2 .carousel-indicators {
  bottom: -2.5rem; /* move the indicators below the image */
}
#client2 .carousel-indicators [data-bs-target] {
  background-color: grey; /* inactive indicators */
}
#client2 .carousel-indicators .active {
  background-color: darkgrey; /* active indicator */
}

#client2 .card {
	border: 0;
	margin-bottom: 32px;
}
#client2 .card-body {
	padding-top: 12px;
}
#client2 .card-title {
	text-align: left;
	padding: 0 4px 20px;
}
#client2 .card-text {
	color: #5e5e5e;
	padding: 0 4px;
	line-height: 1.45em;
}
#client2 .partnerlogo{
	text-align: center;
}
@media (min-width: 768px) {
  	#client2 {
		display: none;
  	}
}
/* partner */
#partner {
	background-color: #f6f6f6;
	padding: 32px 0px;
}
#partner .card {
	border: 0;
	border-radius: 0;
	margin-bottom: 0;
}
/* cards and photos form one seamless grid, as in the design */
#partner .row:has(> [class*="col-"]) {
	margin-left: 0;
	margin-right: 0;
}
#partner .row > [class*="col-"] {
	padding-left: 0;
	padding-right: 0;
}
#partner .card .image {
	border-radius: 0;
}
#partner .card-body {
	padding: 1.5rem 1.5rem;
}
#partner .card-title {
	text-align: left;
	padding: 0 4px 20px;
}
#partner .card-text {
	color: #5e5e5e;
	padding: 0 4px;
	line-height: 1.45em;
}
#partner .partnerlogo{
	text-align: left;
	align-content: center;
}
/* desktop: all partner logos 72px high, except TARA Systems and Embedded Wizard */
#partner .partnerlogo img:not([src*="TARASystems"]):not([src*="EmWi-Logo"]) {
	height: 72px;
	width: auto;
	max-width: 100%;
}
#partner .partnerlogo img[src*="uxtweak"][src],
#partner .partnerlogo img[src*="busch-labs"][src] {
	height: 64px;
}
#partner .partnerlogo img[src*="TARASystems"],
#partner .partnerlogo img[src*="EmWi-Logo"] {
	height: 80px;
	width: auto;
	max-width: 100%;
}
/* FH logo row: fixed 24px gaps (the &emsp; spacers collapse to 0) */
#partner .partnerlogo:has(img[src*="FH-Salzburg"]) {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 24px;
	font-size: 0;
}
/* TARA / Embedded Wizard: 24px gap */
#partner .partnerlogo a:has(img[src*="EmWi-Logo"]) {
	margin-left: 24px;
}
/* touch targets: the link box wraps the whole logo (an inline <a> is only as
   tall as its text line, which Lighthouse flags as a too-small tap target) */
#partner .partnerlogo a {
	display: inline-block;
	vertical-align: top;
}
#partner .partnerlogo a img {
	display: block;
}
#partner .card .image {
	border: 0;
	height: 100%;
	width: 100%;
    object-fit: cover;
}
#partner .carousel{
	margin-top: 0px;
	margin-bottom: 32px;
}


@media (max-width: 1023.98px) {
  	#partner {
		display: none;
  	}
}
#partner2 {
	background-color: #f6f6f6;
	padding: 32px 0px;
}
#partner2 h2 {
  	line-height: 1.45em;
  	text-align: left;
	margin-top: 0px;
}
#partner2 h3 {
  	color: #67267a;
  	line-height: 1.2em;
  	margin-bottom: 12px;
	text-align: left;
	font-weight: 400;
}
#partner2 .carousel{
	margin-top: 0px;
	margin-bottom: 32px;
}
#partner2 .card {
	border: 0;
	margin-bottom: 32px;
}
#partner2 .card-body {
	padding-top: 12px;
}
#partner2 .card-title {
	text-align: left;
	padding: 0 4px 20px;
}
#partner2 .card-text {
	color: #5e5e5e;
	padding: 0 4px;
	line-height: 1.45em;
}
#partner2 .partnerlogo{
	text-align: left;
}
/* mobile/tablet: all partner logos share one height - 64px, or less when the
   widest row (3 FH logos, 309px wide at 64px high + 2 x 16px gaps) would not
   fit the card: height = (logo area width - 32px) * 64 / 309.
   The grid column is the size container (the card itself is content-sized);
   logo area = column content width - 2 x 16px card-body padding. */
#partner2 .row > [class*="col-"] {
	container-type: inline-size;
}
#partner2 .card {
	width: 100%;
}
#partner2 .partnerlogo img {
	height: min(64px, calc((100cqw - 64px) * 0.207));
	width: auto;
	max-width: 100%;
	object-fit: contain;
	margin: 4px 0;
}
/* touch targets: the link box wraps the whole logo, not just one text line.
   The gap between neighbouring links is real margin on the <a> (24px), not
   margin inside the link: with fractional logo widths the link boxes of
   TARA Systems / Embedded Wizard otherwise touch or overlap by sub-pixels. */
#partner2 .partnerlogo a {
	display: inline-block;
	vertical-align: top;
	min-height: 48px;
}
#partner2 .partnerlogo:not(.partnerlogo-row) a:not(:last-child) {
	margin-right: 24px;
}
#partner2 .partnerlogo a img {
	display: block;
}
/* FH logos stay on one line */
#partner2 .partnerlogo-row {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	font-size: 0; /* hides the &emsp; spacers */
}
#partner2 .partnerlogo-row a + a {
	margin-left: 16px; /* margin, not gap: the hidden spacers would get gaps too */
}
#partner2 .partnerlogo-row img {
	display: block;
	max-width: none;
	margin: 4px 0;
}
@media (min-width: 1024px) {
  	#partner2 {
		display: none;
  	}
}

/* method portfolio */
#method {
	padding: 32px 0px;
}
#method h2 {
  	line-height: 1.45em;
  	text-align: left;
}
#method h3 {
  	color: #4d4d4d;
  	line-height: 1;
	text-align: left;
	font-weight: 400;
}
#method .card {
	border: 0;
	border-radius: 0;
	background-color: #f6f6f6;
	margin-bottom: 24px;
}
#method .card-body {
	padding: 24px;
}
#method .card-title {
	text-align: left;
	padding: 0;
	margin-bottom: 4px; /* 4px to the subtitle */
}
#method .card-subtitle {
	font-family: "Work Sans", sans-serif;
	margin-top: 0; /* Bootstrap pulls it up by .375rem */
	color: #67267a;
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: 1;
	text-align: left;
	padding: 0 0 22px;
}
#method .card-text {
	color: #4d4d4d;
	padding: 0;
	line-height: 1.5;
	margin-bottom: 18px;
}
/* CX / UX method columns: 12px gutter inside the card */
#method .row.card-text {
	--bs-gutter-x: 12px;
	margin-bottom: 0;
}
#method .method-title {
	color: #67267a;
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 1.5;
	text-align: left;
	margin-bottom: 4px;
}
#method .list {
	padding-left: 24px;
	margin-bottom: 0;
}
#method .list li::marker {
	font-size: 0.8em;
}
#method .list-empty {
	margin: 0;
}
@media (max-width: 1024px) {
	#method {
    	background-attachment: scroll;
		margin-top: 32px;
  	}
	#method h2{
		margin-bottom: 0px;
		margin-top: 0px;
  	}
  	#method .card{
    	margin-top: 20px;
		margin-bottom: 0;
  	}
}
/* UX mentoring + appointment booking box */
#mentoring {
	padding: 32px 0;
}
#mentoring h2 {
	margin-bottom: 20px;
}
#mentoring .card {
	width: 100%;
	border: 0;
	border-radius: 0;
	background-color: #f6f6f6;
	margin-left: 0; /* same 24px column gap as the section above */
}
#mentoring .card-body {
	padding: 24px;
}
#mentoring .card-title {
	color: #67267a;
	font-weight: 400;
	margin-bottom: 20px;
}
#mentoring .mentoring-buttons {
	display: flex;
	flex-direction: column;
	align-items: center; /* centred like "Email schicken"; left-aligned row on tablet */
	gap: 16px;
	margin: 24px 0 0;
}
#mentoring .button,
#contact .contact-mentoring .button {
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 1px;
	padding: 12px 24px;
	border-radius: 50px;
	line-height: 1;
	color: #fff;
	background-color: #67267a;
	transition: 0.5s;
}
#mentoring .button:hover,
#contact .contact-mentoring .button:hover {
	background-color: #ff8f42;
	color: #fff;
}
@media (max-width: 991.98px) {
	#mentoring .card {
		margin-left: 0;
		margin-top: 16px;
	}
}

/* sub-pages*/
/* desktop: side box is as tall as the text column (ends with the accordion);
   the photo scales to fill whatever height is left */
@media (min-width: 992px) {
	#sub-page .text + [class*="col-lg-4"] {
		align-self: stretch !important;
	}
	#sub-page .text + [class*="col-lg-4"] > .card {
		width: 100%;
		margin-bottom: 0;
		margin-left: 0; /* 24px gutter to the text column, as in the design */
	}
	#sub-page .text + [class*="col-lg-4"] .card-body {
		display: flex;
		flex-direction: column;
		height: 100%;
	}
	#sub-page .text + [class*="col-lg-4"] .card-body > p.center:first-child {
		flex: 1 1 0;
		min-height: 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-end;
		margin-bottom: 16px;
	}
	#sub-page .text + [class*="col-lg-4"] .card-body > p.center:first-child > br {
		display: none;
	}
	#sub-page .text + [class*="col-lg-4"] .card-body > p.center:first-child .image {
		flex: 1 1 0;
		min-height: 0;
		max-height: 360px; /* keep the photo from growing with a tall text column */
		width: 100%;
		height: auto;
		object-fit: contain;
		object-position: center bottom;
		margin-bottom: 8px;
	}
	#sub-page .text + [class*="col-lg-4"] .card-body > p.center:last-child {
		margin-bottom: 0;
	}
}
#sub-page .sidebar-caption {
	display: inline-block;
	margin-top: 8px;
	font-size: 14px;
	line-height: 1.25;
	color: #4d4d4d;
}
#sub-page {
}
/* last question ends flush with the bottom of the side box */
#sub-page .accordion .card3:last-child {
	margin-bottom: 0;
}

#sub-page .accordion-header{
	font-weight: 500;
	margin-bottom: 0px;
	color: #fff;
	line-height: normal;
}
#sub-page .accordion-button {
	font-weight: 400;
  	color: rgb(255, 255, 255);
  	font-size: 18px;
  	background-color: #67267a;
  	margin-top: 1px;
  	margin-bottom: 1px;
  	padding: 16px;
}
#sub-page .card {
	border: 0;
	background-color: #f6f6f6;
	margin-bottom: 32px;
	margin-left: 32px;
}
#sub-page .card2 {
	border: 0;
	background-color: #f6f6f6;
	width: 100%;
	margin-top: 46px;    /* room for the icon circle that sits on the top edge */
	margin-bottom: 24px;
}
#sub-page .card3 {
	border: 0;
	background-color: #f6f6f6;
	margin-bottom: 16px;
}
#sub-page .card-body {
	padding-top: 12px;
}
#sub-page .card-text {
	color: #5e5e5e;
}
#sub-page .card-icon {
	text-align: center;
	margin-top: -32px;
}
#sub-page .card-icon .background,
#contact .card-icon .background {
	width: 64px;
	height: 64px;
	background-color: #f6f6f6;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #67267a;
}
#sub-page .card-icon .icon,
#contact .card-icon .icon {
	width: 28px;
	height: 28px;
}
#sub-page .center {
	text-align: center;
}
#sub-page .image {
	width: 66%;
}
#sub-page .no-card {
	font-weight: 700;
	margin-bottom: 32px;
}
#sub-page img {
	margin-bottom: 1rem;
}
/* width/height attributes reserve space (no layout shift); auto keeps the ratio when CSS sets the width */
#sub-page img[width][height] {
	height: auto;
}
#sub-page .button {
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 1px;
	display: inline-block;
	padding: 12px 24px ;
	border-radius: 50px;
	transition: 0.5s;
	line-height: 1;
	text-align: center;
	color: #fff;
	background-color: #67267a;
}
#sub-page .button:hover {
	background-color: #ff8f42;
	color: #fff;
}
#sub-page .accordion-body{
	text-align: justify;
}

@media (max-width: 1024px) {
  	#sub-page {
    	background-attachment: scroll;
		margin-top: 12px;
  	}
  	#sub-page h2:not(:where(.h3, .h4)){
  		font-weight: 700;
		margin-bottom: 32px;
		margin-top: 32px;
  	}
	#sub-page .accordion-header{
		font-weight: 500;
		margin: 0px ;
	}
  	#sub-page .card{
    	margin-top: 16px;
		margin-left: 0px;
		margin-bottom: 0px;
  	}
	 #sub-page .card2{
    	margin-top: 40px;
  	}
	#sub-page .image {
		width: 50%;
	}
	#sub-page img {
		margin-bottom: 0;
	}
	#sub-page .card-body {
  		padding-top: 0px;
	}
}

/* insta guides */
#insta {
  	margin-top: 32px;
	padding-bottom: 20px;
}
#insta h2{
  	font-weight: 700;
	margin-bottom: 32px;
}
#insta img {
	max-width: 100%;
	height: auto;
	display: block;
	margin-bottom: 32px;
}

@media (max-width: 1024px) {
  	#insta {
    	background-attachment: scroll;
		margin-top: 32px;
  	}
  	#insta h2{
  		font-weight: 700;
		margin-bottom: 20px;
  	}
  	#insta img {
		max-width: 100%;
		height: auto;
		display: block;
		margin-bottom: 20px;
  	}
}

/* about: intro + photo, timelines (target icon, purple date badge), stat boxes, skill chips */
/* each block behaves like its own section: 40px above and below (80px between blocks) */
#about .about-row + .about-row {
	margin-top: 80px;
}
#about .about-row > [class*="col"] > :last-child,
#about .timeline > .tl-item:last-child > :last-child,
#about .timeline > .tl-item:last-child li:last-child {
	margin-bottom: 0;
}
#about h1 {
	margin-bottom: 24px;
}
#about h2 {
	margin-bottom: 24px;
}
#about .about-photo {
	display: block;
	width: 100%;
	height: 100%;
	max-height: 440px;
	object-fit: cover;
	object-position: center 30%;
	border-radius: 4px;
}

#about .section-note {
	margin: -12px 0 20px;
	font-style: italic;
	color: #4d4d4d;
}

/* timeline */
#about .timeline {
	position: relative;
	padding-left: 32px;
}
#about .timeline::before {
	content: "";
	position: absolute;
	left: 11px;
	top: 12px;
	bottom: 0;
	border-left: 1px solid #4d4d4d;
}
#about .tl-item + .tl-item {
	margin-top: 16px;
}
#about .tl-title {
	position: relative;
	font-family: "Work Sans", sans-serif;
	font-size: 20px;
	font-weight: 400;
	line-height: 1.2;
	color: #67267a;
	margin: 0 0 12px;
}
@media (max-width: 1024px) {
	#about .tl-title {
		font-size: 16px;
	}
}
#about .tl-mark {
	position: absolute;
	left: -31px;
	top: 1px;
	width: 22px;
	height: 22px;
	color: #67267a;
	background: #fff;
	border-radius: 50%;
}
#about .tl-date {
	display: inline-block;
	min-width: 160px;
	margin: 0 0 8px -20px;
	padding: 4px 20px;
	background-color: #67267a;
	color: #fff;
	line-height: 1.4;
}
#about .tl-sub {
	margin: 0 0 8px;
	color: #4d4d4d;
}
#about .tl-sub a {
	color: #67267a;
}
#about .tl-sub a:hover {
	color: #ff8f42;
}
#about .tl-item ul {
	margin: 12px 0 0;
	padding-left: 44px;
}
#about .tl-item li {
	margin-bottom: 4px;
}

/* right column: stat boxes + chips, centred */
#about .about-side {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
#about .about-side h2 {
	margin: 32px 0 20px;
	text-align: center;
}
#about .about-side h2:first-child {
	margin-top: 0;
}
#about .stat {
	display: flex;
	flex-direction: column;
	width: 278px;
	max-width: 100%;
	margin-bottom: 24px;
	border: 1px solid #67267a;
	border-radius: 16px;
	overflow: hidden;
}
#about .stat-value {
	padding: 16px;
	font-family: "Work Sans", sans-serif;
	font-size: 30px;
	font-weight: 500;
	line-height: 1.2;
	color: #67267a;
	background: #fff;
}
#about .stat-label {
	padding: 16px 24px;
	font-family: "Work Sans", sans-serif;
	font-size: 18px;
	line-height: 1.1;
	text-transform: uppercase;
	color: #fff;
	background: #67267a;
}
#about .stat-group {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
}
/* tablet: stat boxes of one group side by side */
@media (min-width: 768px) and (max-width: 991.98px) {
	#about .stat-group {
		flex-direction: row;
		align-items: stretch;
		justify-content: center;
		gap: 24px;
		margin-bottom: 24px;
	}
	#about .stat-group .stat {
		flex: 1 1 0;
		margin-bottom: 0;
	}
	#about .stat-group .stat-label {
		flex: 1 0 auto;
		display: flex;
		align-items: center;
		justify-content: center;
	}
}
#about .about-publications {
	text-align: center;
	margin: -12px 0 24px;
}
#teaser.publications h2 {
	margin-top: 24px;
}
#teaser.publications ul {
	padding-left: 1.25rem;
}
#teaser.publications li {
	margin-bottom: 12px;
	overflow-wrap: anywhere;
}
#about .stat-label--hindex {
	text-transform: none; /* keep the lowercase "h" */
}
#about .chips {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}
#about .chips li {
	padding: 12px 18px;
	border: 1px solid #67267a;
	border-radius: 27px;
	line-height: 1.2;
	color: #4d4d4d;
}

@media (max-width: 991.98px) {
	#about .about-photo {
		height: auto;
		max-height: none;
		margin-top: 24px;
	}

	/* stacked: stat boxes + skills first, then the timeline */
	#about .about-side {
		order: -1;
		margin-bottom: 40px;
	}
}

/* footer: three columns (pages, address/contact, photo) + copyright + full-width map */
#footer {
	background: #fff;
	color: #4d4d4d;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.25;
}
#footer .footer-top {
	padding: 40px 0 0;
}
#footer .footer-top h4,
#footer .footer-top .h4 {
	font-weight: 400;
	line-height: 1.2;
	color: #67267a;
	margin: 0 0 16px;
}
#footer .footer-top p {
	margin: 0 0 24px;
	color: #4d4d4d;
}
#footer a {
	color: #4d4d4d;
}
#footer a:hover {
	color: #ff8f42;
}

/* pages */
#footer .footer-links ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
#footer .footer-links li {
	margin-bottom: 9px;
}
#footer .footer-links a {
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* address + contact */
#footer .footer-top .footer-links :is(h4, .h4),
#footer .footer-top .footer-contact :is(h4, .h4) {
	margin-bottom: 12px;
}
#footer .footer-contact-list {
	list-style: none;
	padding: 0;
	margin: 0 0 24px;
}
#footer .footer-contact-list li {
	margin-bottom: 4px;
}
#footer .footer-contact-list a {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}
#footer .footer-contact-list .icon {
	width: 24px;
	height: 24px;
	color: #67267a;
}

/* photo + tagline + social links */
#footer .footer-info {
	display: flex;
	gap: 12px;
	align-self: flex-start; /* as tall as the photo, so the social links end at its bottom edge */
}
#footer .footer-image {
	flex: 0 0 140px;
	width: 140px;
	height: auto;
	align-self: flex-start;
}
#footer .footer-info-text {
	display: flex;
	flex-direction: column;
}
/* keep the designed two-line tagline (explicit <br>, no extra wrapping) */
#footer .footer-info-text :is(h4, .h4) {
	white-space: nowrap;
}
@media (min-width: 992px) {
	#footer .footer-info {
		justify-content: flex-end;
	}
}
#footer .footer-info-text p {
	margin-bottom: 0;
}
#footer .footer-top .footer-info-text .footer-connect {
	margin-top: auto; /* push "Vernetzen wir uns über ..." + icons to the bottom of the photo */
	padding-top: 24px;
}
#footer .social-links {
	display: flex;
	gap: 24px;
	margin-top: 12px;
}
#footer .social-links a {
	color: #67267a;
	line-height: 0;
}
#footer .social-links a:hover {
	color: #ff8f42;
}
#footer .social-links .icon {
	width: 24px;
	height: 24px;
}

/* copyright */
#footer .copyright {
	text-align: center;
	font-size: 16px;
	padding: 16px 0 52px;
}
#footer .copyright a {
	color: #67267a;
	text-decoration: none;
}
#footer .copyright a:hover {
	color: #ff8f42;
}

/* interactive Google map, greyscale as in the design */
#footer .footer-map {
	height: 500px;
	line-height: 0;
}
#footer .footer-map iframe {
	width: 100%;
	height: 100%;
	border: 0;
	filter: grayscale(1);
}

/* tablet: hide the pages column, address left / photo right */
@media (max-width: 991.98px) {
	#footer .footer-links {
		display: none;
	}
	#footer .footer-image {
		flex-basis: 120px;
		width: 120px;
	}
}
@media (max-width: 767.98px) {
	#footer .footer-image {
		flex-basis: 140px;
		width: 140px;
	}
}
/* mobile: stack everything */
@media (max-width: 767.98px) {
	#footer .footer-info {
		margin-top: 8px;
	}
	#footer .copyright {
		font-size: 14px;
	}
}

/* back to top button */
.back-to-top {
  	position: fixed;
  	visibility: hidden;
  	opacity: 0;
  	right: 12px;
  	bottom: 16px;
  	z-index: 996;
  	background-color: rgba(103, 38, 122, 0.75);
  	width: 48px;
  	height: 48px;
  	border-radius: 50%;
  	transition: all 0.4s;
}
.back-to-top .icon {
  	font-size: 24px;
  	color: #fff;
  	line-height: 0;
}
.back-to-top:hover {
  	background-color: #67267a;
  	color: #fff;
}
.back-to-top.active {
  	visibility: visible;
  	opacity: 1;
}

/* FAB buttons */
.email-button {
  	position: fixed;
  	top: 200px; 
  	right: 12px;
  	background-color: rgba(103, 38, 122, 0.75);
  	border-radius: 50px;
  	display: inline-flex;
  	justify-content: center;
  	align-items: center;
  	gap: 4px;
  	width: 48px;
  	height: 48px;
  	padding: 12px 13px;
cursor: pointer;
  	transition: width 0.3s ease, padding 0.3s ease;
  	overflow: hidden;
  	text-decoration: none;
}

.phone-button {
  	position: fixed;
  	top: 260px; 
  	right: 12px;
  	background-color: rgba(103, 38, 122, 0.75);
  	border-radius: 50px;
  	display: inline-flex;
  	justify-content: center;
  	align-items: center;
  	gap: 4px;
  	width: 48px;
  	height: 48px;
  	padding: 12px 13px;
cursor: pointer;
  	transition: width 0.3s ease, padding 0.3s ease;
  	overflow: hidden;
  	text-decoration: none; 
}

.LinkedIn-button {
  	position: fixed;
  	top: 320px; 
  	right: 12px;
	background-color: rgba(103, 38, 122, 0.75);
  	border-radius: 50px;
  	display: inline-flex;
  	justify-content: center;
  	align-items: center;
  	gap: 4px;
  	width: 48px;
  	height: 48px;
  	padding: 12px 13px;
cursor: pointer;
  	transition: width 0.3s ease, padding 0.3s ease;
  	overflow: hidden;
  	text-decoration: none;
}

/* icon */
.email-button .icon, .phone-button .icon, .LinkedIn-button .icon {
  	width: 22px;
  	height: 22px;
	color: #fff;
  	transition: transform 0.3s ease;
	vertical-align: middle; 
}

/* side rail buttons follow the Figma spec: 48px high, 12px/13px padding, 4px icon-label gap.
   hover widths = 13px + 22px icon + 4px gap + label + 13px (+4px buffer for font rendering) */
/* text hidden initially */
.hover-text {
	white-space: nowrap;
  	margin-left: 0;
  	opacity: 0;
  	transition: opacity 0.2s ease, margin-left 0.3s ease;
	visibility: hidden;
	vertical-align: middle;
	display: none;
}


/* Show text on hover and on keyboard focus */
.email-button:hover, .email-button:focus-visible{
  	width: 248px;
	color: #fff;
	background-color: #67267a;
}

.phone-button:hover, .phone-button:focus-visible{
  	width: 170px;
	color: #fff;
	background-color: #67267a;
}

.LinkedIn-button:hover, .LinkedIn-button:focus-visible{
  	width: 281px;
	color: #fff;
	background-color: #67267a;
}

.email-button:hover .hover-text,
.phone-button:hover .hover-text,
.LinkedIn-button:hover .hover-text,
.email-button:focus-visible .hover-text,
.phone-button:focus-visible .hover-text,
.LinkedIn-button:focus-visible .hover-text {
    display: inline;    /* appear next to icon only on hover / keyboard focus */
    margin-left: 0;     /* spacing comes from the 4px flex gap */
    opacity: 1;
    visibility: visible;
}
@media (max-width: 1000px) {
	.email-button {
		right: 8px;
	}

	.phone-button {
		right: 8px;
	}

	.LinkedIn-button {
		right: 8px;
	}
	
	.back-to-top {
		right: 8px;
	}
}

@media (max-width: 428px) {
	.email-button {
		top: auto;
		bottom: 16px;
		left: 16px;
		background-color: #67267a;
	}

	.phone-button {
		top: auto;
		bottom: 16px; 
		left: 75px;
		background-color: #67267a;
	}

	.LinkedIn-button {
		top: auto;
		bottom: 16px; 
		left: 135px;
		background-color: #67267a;
	}
	
	.back-to-top {
		background-color: #67267a;
	}
}

/* Barlow */
.barlow-thin {
  font-family: "Barlow", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.barlow-extralight {
  font-family: "Barlow", sans-serif;
  font-weight: 200;
  font-style: normal;
}

.barlow-light {
  font-family: "Barlow", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.barlow-regular {
  font-family: "Barlow", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.barlow-medium {
  font-family: "Barlow", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.barlow-semibold {
  font-family: "Barlow", sans-serif;
  font-weight: 600;
  font-style: normal;
}

.barlow-bold {
  font-family: "Barlow", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.barlow-extrabold {
  font-family: "Barlow", sans-serif;
  font-weight: 800;
  font-style: normal;
}

.barlow-black {
  font-family: "Barlow", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.barlow-thin-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 100;
  font-style: italic;
}

.barlow-extralight-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 200;
  font-style: italic;
}

.barlow-light-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.barlow-regular-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.barlow-medium-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 500;
  font-style: italic;
}

.barlow-semibold-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 600;
  font-style: italic;
}

.barlow-bold-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.barlow-extrabold-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 800;
  font-style: italic;
}

.barlow-black-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 900;
  font-style: italic;
}

/* every content section: 40px padding top and bottom (overrides the older per-section values) */
#main-content > section {
	padding-top: 40px;
	padding-bottom: 40px;
	margin-top: 0;
	margin-bottom: 0;
}
/* nothing in the last row adds extra space below the 40px */
#main-content > section > .container > .row:last-child,
#main-content > section > .container > .row:last-child > [class*="col"] > .card,
#main-content > section > .container > .row:last-child > [class*="col"] > .card2,
#main-content > section > .container > .row:last-child .testimonial-scroller,
#main-content > section > .container > .row:last-child .carousel,
#main-content > section > .container > .row:last-child > [class*="col"] > :last-child,
#main-content > section > .container > .row:last-child .card-body > :last-child {
	margin-bottom: 0;
}
:is(#process, #process2) .process-benefits li:last-child {
	margin-bottom: 0;
}
#client .testimonial-scroller {
	padding-bottom: 0; /* only the thin scrollbar sits below the cards */
}
#process2 h2 {
	margin-top: 0;
}
/* carousel dots hang below the slides: reserve their space so 40px stays clear */
#main-content > #client2 > .container > .row:last-child .carousel {
	margin-bottom: 24px;
}
/* Human First: process graphic inside the text column, no extra padding around it */
#sub-page :is(#process, #process2) {
	padding-top: 0;
	padding-bottom: 0;
}
#sub-page :is(#process, #process2) img {
	margin-bottom: 16px !important;
}

/* one corner radius for all cards and accordions (same as the side box: 4px) */
.card,
#sub-page .card2,
:is(#client, #client2) .testimonial,
.accordion-item {
	border-radius: 4px !important;
	overflow: hidden;
}
.card > .image,
.card .card-img-top {
	border-radius: 0;
}
/* the button is clipped by the rounded item; keep it square inside */
.accordion-item .accordion-button {
	border-radius: 0 !important;
}
/* Bootstrap removes the outline on :focus; use the same ring as all other buttons.
   The rounded item clips anything outside, so let it overflow while the button has focus */
.accordion-item .accordion-button:focus {
	box-shadow: none;
}
.accordion-item .accordion-button:focus-visible {
	outline: 2px solid #67267a;
	outline-offset: 2px;
	box-shadow: 0 0 6px 3px rgba(255, 143, 66, 0.7);
	border-radius: 4px !important;
}
.accordion-item:has(.accordion-button:focus-visible) {
	overflow: visible;
}
/* cards with an icon circle on the top edge must not clip it;
   the teaser text card (no padding) must not clip the button's focus ring */
#services .service,
#sub-page .card2,
#teaser .card:has(> .card-body) {
	overflow: visible;
}
/* 8px between accordion questions */
#sub-page .accordion .card3 {
	margin-top: 0;
	margin-bottom: 8px;
}
#sub-page .accordion .card3:last-child {
	margin-bottom: 0;
}
/* stacked layout: 24px between the CTA text and the image below it */
@media (max-width: 991.98px) {
	#teaser .row > [class*="col-lg-8"] + [class*="col-lg-4"] {
		margin-top: 24px;
	}
}
/* stacked service cards: 24px between a card and the icon circle of the next one
   (circle sticks out 32px above its card) */
@media (max-width: 991.98px) {
	#services .row > [class*="col"] + [class*="col"] > .service {
		margin-top: 56px;
	}
}
/* mobile partner image carousel: same 4px corners as the cards */
#partner2 .carousel-inner {
	border-radius: 4px;
	overflow: hidden;
}
/* touch screens: email + phone in the footer get a 40px tap height */
@media (max-width: 991.98px) {
	#footer .footer-contact-list li {
		margin-bottom: 0;
	}
	#footer .footer-contact-list a {
		min-height: 40px;
	}
}
/* touch screens: 40px tap targets in the top bar and for the menu button,
   icons stay where they were (gaps shrink by the extra tap area) */
@media (max-width: 991.98px) {
	#topbar {
		padding: 0;
	}
	#topbar .contact a,
	#topbar .socialmedia a {
		justify-content: center;
		min-width: 40px;
		height: 40px;
	}
	#topbar .contact-left,
	#topbar .socialmedia {
		gap: 8px;
	}
	#topbar .contact-left {
		margin-left: -8px;
	}
	/* pills stay unchanged; an invisible overlay makes them 40px tall to tap */
	#topbar .contact-right .language {
		position: relative;
	}
	#topbar .contact-right .language::after {
		content: "";
		position: absolute;
		inset: -8px -4px;
	}
	.mobile-nav-toggle {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		min-width: 40px;
		min-height: 40px;
		margin-right: -4px;
	}
}
/* UX honeycomb diagram: half width on desktop, full text width on mobile */
#sub-page .honeycomb {
	width: 50%;
	height: auto;
}
@media (max-width: 767.98px) {
	#sub-page .honeycomb {
		width: 100%;
	}
}
/* tablet: booking box is full width, so the two buttons sit side by side */
@media (min-width: 768px) and (max-width: 991.98px) {
	#mentoring .mentoring-buttons {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: flex-start;
	}
}
/* tablet: "Email schicken" button left-aligned like the text above it */
@media (min-width: 768px) and (max-width: 991.98px) {
	#sub-page .text + [class*="col-lg-4"] .card-body > p.center:last-child {
		text-align: left;
	}
}
/* "ADPList" link in the mentee feedback heading */
:is(#client, #client2) h2 a {
	color: #67267a;
}
:is(#client, #client2) h2 a:hover {
	color: #ff8f42;
}
/* icons inside the email / phone links turn orange together with the text */
#topbar .contact a:hover .icon,
#topbar .contact a:hover span,
#footer .footer-contact-list a:hover .icon {
	color: #ff8f42;
}

/* contact page: cards + mentoring box + map in one grid
   desktop: Email | Handy | Adresse (2 cols) / Mentoring (2 cols) | Map (2 cols)
   tablet:  cards stacked left, map right, mentoring below
   mobile:  everything stacked, no map */
#contact .contact-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	grid-template-areas:
		"email mobile address address"
		"mentoring mentoring map map";
	gap: 24px;
	margin-top: 32px; /* room for the icon circles */
}
#contact .contact-email { grid-area: email; }
#contact .contact-mobile { grid-area: mobile; }
#contact .contact-address { grid-area: address; }
#contact .contact-mentoring { grid-area: mentoring; }
#contact .contact-map { grid-area: map; }

#contact .info-box {
	position: relative;
	margin: 0;
	padding: 32px 16px 24px;
	text-align: center;
	background-color: #f6f6f6;
	border-radius: 4px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
#contact .info-box .card-icon {
	position: absolute;
	top: -32px;
	left: 50%;
	transform: translateX(-50%);
}
#contact .info-box :is(h3, .h3) {
	color: #67267a;
	font-weight: 400;
	margin: 0 0 12px;
	text-align: center;
}
#contact .info-box p {
	margin: 0;
	line-height: 24px;
	color: #4d4d4d;
}
#contact .info-box a {
	color: #4d4d4d;
}
#contact .info-box a:hover {
	color: #ff8f42;
}
#contact .address-br {
	display: none;
}

#contact .contact-mentoring {
	padding: 24px;
	background-color: #f6f6f6;
	border-radius: 4px;
}
#contact .contact-mentoring h2 {
	margin: 0 0 20px;
	padding: 0;
}
#contact .contact-mentoring p {
	text-align: left;
}
#contact .contact-mentoring .mentoring-buttons {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap; /* side by side when they fit, otherwise below each other */
	align-items: flex-start;
	gap: 16px;
	margin: 24px 0 0;
}
#contact .contact-map {
	min-height: 300px;
	border-radius: 4px;
	overflow: hidden;
	line-height: 0;
}
#contact .contact-map iframe {
	width: 100%;
	height: 100%;
	min-height: 300px;
	border: 0;
	filter: grayscale(1);
}
/* the page has its own map on desktop/tablet, so the footer map is not repeated there;
   on mobile the page map is hidden and the footer map is shown instead */
@media (min-width: 768px) {
	body:has(#contact .contact-map) #footer .footer-map {
		display: none;
	}
}

@media (max-width: 991.98px) {
	#contact .contact-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-areas:
			"email map"
			"mobile map"
			"address map"
			"mentoring mentoring";
		row-gap: 56px; /* 24px + the icon circle that sticks out 32px */
	}
	#contact .contact-mentoring {
		margin-top: -32px; /* no icon circle here: keep the gap at 24px */
	}
	#contact .address-br {
		display: inline;
	}
}
@media (max-width: 767.98px) {
	#contact .contact-grid {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas:
			"email"
			"mobile"
			"address"
			"mentoring";
	}
	#contact .contact-map {
		display: none;
	}
}
/* mobile: the footer skips address + contact (top bar, side buttons and contact page cover them)
   and leaves white space below the footer map, so at the end of the page the map scrolls up
   and the floating action buttons (16px + 48px from the bottom) sit on white */
@media (max-width: 767.98px) {
	#footer .footer-contact {
		display: none;
	}
	#footer {
		padding-bottom: 80px;
	}
}
/* tablet footer: photo as tall as the footer content next to it;
   address column narrower so photo + tagline fit */
@media (min-width: 768px) and (max-width: 991.98px) {
	#footer .footer-contact {
		flex: 0 0 40%;
		max-width: 40%;
	}
	#footer .footer-info {
		flex: 0 0 60%;
		max-width: 60%;
		align-self: stretch;
		justify-content: flex-end;
		margin-bottom: 8px; /* the phone link has 8px of tap area below its icon */
	}
	#footer .footer-contact-list {
		margin-bottom: 0;
	}
	#footer .footer-image {
		flex: 0 0 auto;
		width: auto;
		height: 100%;
		align-self: stretch;
		object-fit: contain;
		object-position: left bottom;
	}
}
/* desktop footer: photo as tall as the address/contact column, so the photo bottom and
   the social icons line up with the phone row */
@media (min-width: 992px) {
	#footer .footer-info {
		align-self: stretch;
		margin-bottom: 28px; /* the phone row is followed by 4px li + 24px list margin */
	}
	#footer .footer-image {
		flex: 0 0 auto;
		width: auto;
		height: 100%;
		align-self: stretch;
		object-fit: contain;
		object-position: left bottom;
	}
}
/* footer tagline: extra break before "CUXpro" only on mobile; photo as tall as the text next to it */
#footer .footer-br-m {
	display: none;
}
@media (max-width: 767.98px) {
	#footer .footer-br-m {
		display: inline;
	}
	#footer .footer-info {
		align-items: stretch;
	}
	#footer .footer-image {
		flex: 0 0 auto;
		width: auto;
		height: auto;
		max-width: 45%;
		align-self: stretch;
		object-fit: contain;
		object-position: left bottom;
	}
}

/* method portfolio: cards show title + subtitle and open while scrolled through the middle
   of the screen (js/main.js adds .method-scroll and toggles .is-open); without JS they stay open */
/* all cards full column width; on desktop the cards of a row keep the same height */
#method .card {
	width: 100%;
}
@media (max-width: 991.98px) {
	#method .row > [class*="col"] {
		align-items: flex-start !important;
	}
}
#method .card-subtitle {
	padding-bottom: 0;
}
#method .method-details-inner > :first-child {
	margin-top: 22px; /* space between subtitle and text once open */
}
.method-scroll #method .method-details {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.45s ease;
}
.method-scroll #method .method-details-inner {
	min-height: 0;
	overflow: hidden;
	visibility: hidden; /* closed content leaves the accessibility tree and tab order; delayed until the collapse finishes */
	transition: visibility 0s 0.45s;
}
.method-scroll #method .card.is-open .method-details {
	grid-template-rows: 1fr;
}
.method-scroll #method .card.is-open .method-details-inner {
	visibility: visible;
	transition-delay: 0s;
}
/* card title = disclosure button (built in main.js); looks like the h3, chevron shows the state */
#method .method-toggle {
	all: unset;
	display: block;
	width: 100%;
	font: inherit;
	color: inherit;
	text-align: inherit;
	cursor: pointer;
	padding: 2px 0; /* 24px tap height on phones without moving the title */
	margin: -2px 0;
	scroll-margin-top: 120px; /* clears the fixed header when it receives focus */
}
#method .method-toggle:focus-visible {
	outline: 2px solid #67267a;
	outline-offset: 2px;
	box-shadow: 0 0 6px 3px rgba(255, 143, 66, 0.7);
	border-radius: 4px;
}
#method .card-body {
	position: relative;
}
#method .method-toggle {
	padding-right: 32px; /* keeps long titles clear of the chevron */
}
#method .method-toggle::after {
	content: "";
	position: absolute;
	top: 40px; /* centre of title (24px) + 4px gap + subtitle (20px), below the 24px card padding */
	right: 24px;
	width: 0.45em;
	height: 0.45em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.3s ease;
}
#method .method-toggle[aria-expanded="true"]::after {
	top: 45px;
	transform: rotate(-135deg);
}
.method-scroll #method .card.no-anim .method-details {
	transition: none;
}
/* the script corrects the scroll position itself; the browser's own scroll anchoring would double it */
.method-scroll body {
	overflow-anchor: none;
}
@media (prefers-reduced-motion: reduce) {
	.method-scroll #method .method-details,
	#method .method-toggle::after {
		transition: none;
	}
}
/* carousel pause/resume button (built in main.js), centred below the indicator dots */
.carousel-autoplay {
	margin: 20px 0 24px;
	text-align: center;
}
.carousel-autoplay button {
	display: inline-block;
	min-height: 32px;
	padding: 6px 14px;
	border: 1px solid #67267a;
	border-radius: 20px;
	background: #fff;
	color: #67267a;
	font-size: 14px;
	line-height: 1.3;
	cursor: pointer;
}
.carousel-autoplay button:hover {
	background: #67267a;
	color: #fff;
}
/* contact-page email/phone links get a 24px tap height without moving anything */
#contact .info-box p a {
	display: inline-block;
	padding: 4px 0;
	margin: -4px 0;
}

h3.upcoming {
	margin: 0 0 24px;
}