/* Styles App */
/*
 * theme-wia | Wohnen im Alter Farbschema
 */
/* vars.ci */
/*
 * theme-wia | Wohnen im Alter Farbschema
 */
/* mixins.color    */
/*
 * theme-wia | Wohnen im Alter Farbschema
 */
/* mixins.space */
/* utilities.hacks */
/* mixins.color    */
/* special effects */
html,
dialog,
.footer-copyright {
  color-scheme: light dark;
  background-color: var(--background-color);
  color: var(--color);
  -webkit-tap-highlight-color: transparent;
}

:root body {
  color: var(--color-2);
  background-color: inherit;
}

main > article,
.footer-main {
  background-color: var(--surface-10);
}

:any-link {
  color: #a33f05;
}
:any-link:is(:focus, :hover) {
  color: #bf5106;
}
:any-link::selection {
  background-color: #46270f;
}
:any-link:focus-visible:not([class]) {
  color: #bf5106;
  text-decoration-color: transparent;
  outline: 1px solid currentColor;
  outline-offset: 1px;
}
@supports (overflow: overlay) and (not (text-decoration: green wavy underline)) {
  @media (-webkit-min-device-pixel-ratio: 1) {
    :any-link {
      outline: none !important;
    }
  }
}

:any-link:is([aria-controls], [class|=icon]) {
  color: var(--btn-text, var(--brand-text, inherit));
}
:any-link:is([aria-controls], [class|=icon]):hover {
  -webkit-text-decoration: none;
  text-decoration: none;
}

u, ins, abbr {
  color: inherit;
}

form {
  --form-element-background-color: var(--surface-10);
  --form-element-border-color: var(--color-7);
  --form-element-color: var(--color);
  --form-element-placeholder-color: var(--color-6);
  --form-element-active-background-color: var(--surface-10, inherit);
  --form-element-active-border-color: #eb6a0a;
  --form-element-focus-color: #2c90a8;
  --form-element-accent-color: #2c90a8;
  --form-element-invalid: #C62828;
  --form-element-invalid-border-color: #E53935;
  --form-element-invalid-active-border-color: #C62828;
  --form-element-invalid-focus-color: #E53935;
  --form-element-valid-border-color: #4CAF50;
  --form-element-valid-active-border-color: #388E3C;
  --form-element-valid-focus-color: #4CAF50;
  --switch-color: #2c90a8;
  --switch-background-color: var(--surface-10);
  --switch-checked-background-color: #62b332;
}

:where(h1, .h1) {
  color: var(--h1-color);
}

:where(h2, .h2) {
  color: var(--h2-color);
}

:where(h3, .h3) {
  color: var(--h3-color);
}

:where(h4, .h4) {
  color: var(--h4-color);
}

:where(h5, .h5) {
  color: var(--h5-color);
}

:where(h6, .h6) {
  color: var(--h6-color);
}

.text-dim[class] {
  color: var(--color-6);
}

.text-compl[class] {
  color: #655e53;
}

.text-primary[class] {
  color: #a33f05;
}

.text-secondary[class] {
  color: #3c601a;
}

.text-accent[class] {
  color: #1c616c;
}

[class*=-title].text-compl {
  --color-title: #655e53;
}

[class*=-title].text-primary {
  --color-title: #a33f05;
}

[class*=-title].text-secondary {
  --color-title: #3c601a;
}

[class*=-title].text-accent {
  --color-title: #1c616c;
}

:is(.note, .warn)[class] {
  color: #C62828;
}

.-primary {
  --brand-base: #bf5106;
  --brand-shade: #832c03;
  --brand-light: #fcf2dd;
  --brand-panel: #f7d79b;
  --brand-text: #832c03;
  --brand-line: #f3b66a;
  --brand-hover: #ee8b35;
  --brand-contrast: #260b01;
}

.-secondary {
  --brand-base: #4d8524;
  --brand-shade: #2c4212;
  --brand-light: #e4f4e3;
  --brand-panel: #b4e0ac;
  --brand-text: #2c4212;
  --brand-line: #98d185;
  --brand-hover: #81c35f;
  --brand-contrast: #0e1204;
}

.-accent {
  --brand-base: #237789;
  --brand-shade: #154b50;
  --brand-light: #dae6f0;
  --brand-panel: #aac7dc;
  --brand-text: #154b50;
  --brand-line: #85b6cd;
  --brand-hover: #5ea7bc;
  --brand-contrast: #08171a;
}

.-compl {
  --brand-base: #655e53;
  --brand-shade: #23211d;
  --brand-light: #dddad5;
  --brand-panel: #ccc7c0;
  --brand-text: #23211d;
  --brand-line: #bfb9b0;
  --brand-hover: #aca59a;
  --brand-contrast: #fff;
}

.-grey {
  --brand-base: #363532;
  --brand-shade: #272524;
  --brand-light: #f9f9f9;
  --brand-panel: #ebebeb;
  --brand-text: #272524;
  --brand-line: #c7c7c7;
  --brand-hover: #8e8e8e;
  --brand-contrast: #fff;
}

.-kontur:not(.btn) {
  --font-weight: var(--font-weight-strong);
  outline: var(--border-width, 2px) solid var(--brand-line, var(--brand-base));
  outline-offset: -1px;
}

.-ghost {
  --font-weight: var(--font-weight-strong);
  background-color: var(--brand-light);
  color: var(--brand-shade, inherit);
}

.-ghost.btn {
  --brand-light: var(--surface-10);
  color: var(--btn-text);
}
.-ghost.btn:hover {
  color: var(--btn-text-hover);
}

.shadow-dark {
  box-shadow: var(--shadow-dark);
}

:not([type], .btn)::selection {
  color: var(--color-9);
  background-color: #1c270a;
  text-shadow: none !important;
}

/* components.index */
/* component.cards */
/* mixins.fallbacks */
/* mixins.numbers */
/* mixins.fallbacks */
/* component.card-deck */
/* mixins.fallbacks */
/* assets/styles/components/cards._utils */
.c_card-deck, [data-cards] {
  --deck-items: 1;
  --deck-indent: 25%;
  --grid-ram: repeat( calc(2 * var(--deck-items)), 1fr);
  --column-layout: repeat(var(--deck-items), 1fr);
  --row-layout: auto;
  container: card_deck/inline-size;
  box-sizing: content-box;
  padding-inline: 0;
}

:where(.m_intropage, .c_related, .c_service, .guide-listing) .c_card-deck {
  --_cspc: calc(var(--spacing) - (var(--deck-items, 1) * var(--border-width, 2px)));
  --col-item: calc((var(--deck-width, 100%) / var(--deck-items, 1)) - var(--deck-items, 1) * var(--_cspc));
  --grid-spacing-block: var(--spacing);
  --grid-spacing-inline: var(--spacing);
  padding-inline: 0;
}
@media (min-width: 50em) {
  :where(.m_intropage, .c_related, .c_service, .guide-listing) .c_card-deck {
    --deck-items: 2;
  }
}
:where(.m_intropage, .c_related, .c_service, .guide-listing) .c_card-deck.-deck-duo {
  --deck-items: 2;
}
@media (min-width: 72em) {
  :where(.m_intropage, .c_related, .c_service, .guide-listing) .c_card-deck.-deck-trio {
    --deck-items: 3;
  }
}
@media (min-width: 80em) {
  :where(.m_intropage, .c_related, .c_service, .guide-listing) .c_card-deck:is(.-deck-duo, .-deck-quart) {
    --deck-items: 2;
  }
}

@media (min-width: 64em) {
  :where(.guides, .guide-listing) .c_card-deck {
    --deck-items: 3;
    --column-layout: var(--grid-ram);
    grid-auto-flow: row dense;
  }
  :where(.guides, .guide-listing) .c_card-deck .m_card {
    grid-column-end: span 2;
  }
}

@media (min-width: 30em) {
  :where(.m_intropage, .c_related, .c_service, .guide-listing) .c_card-deck :is(.card-teaser, .page-teaser) {
    --card-columns: var(--_CLeftRight);
    --card-rows: var(--_RLeftRight);
    --card-layout: "h b";
  }
}
@media (min-width: 50em) {
  :where(.m_intropage, .c_related, .c_service, .guide-listing) .c_card-deck :is(.card-teaser, .page-teaser) {
    --card-columns: var(--_CTopBottom);
    --card-rows: var(--_RTopBottom);
    --card-layout: "h" "b";
  }
}

/* Hier können für das :last-child sehr komplexe Konstellationen entstehen, daher erstmal nicht :-)
:where(.m_intropage, .c_related, .c_service, .guide-listing) .c_card-deck[data-pair="odd"] {
	//noinspection CssInvalidMediaFeature
	:is(.card-teaser, .page-teaser):last-child {
		@media ((--md-n-above) and (--elfhundert-below)) {
		// die letzte Card gestreckt
			@include utils.mCardLeftRight() {
				--card-columns: var(--_CLeftRightEven);
				grid-column: 1/-1;
			}
		}
		@media (min-width: 72em) {
			@include utils.mCardTopBottom();
		}
	}
}
*/
/* component.cards */
/* components.card.card */
/* mixins.fallbacks */
/* mixins.device */
/* component.card-deck */
.m_card {
  --block-spacing-block: 0;
  --block-spacing-inline: 0;
  --body-inset: var(--size-fluid-1);
  position: relative !important;
  display: grid;
  grid-template-columns: var(--card-columns, auto);
  grid-template-rows: var(--card-rows, auto);
  grid-template-areas: var(--card-layout, initial);
  transition: transform var(--transition);
}

.m_card {
  --_CLeftRight: [L h-start] 1fr [h-end C b-start] 2fr [b-end R];
  --_CLeftRightEven: [L h-start] 1fr [h-end C b-start] 1fr [b-end R];
  --_RLeftRight: [T h-start b-start] 1fr [M h-end b-end B];
  --_CLeftRightCTA: [L] 1fr [C] 2fr [R];
  --_RLeftRightCTA: [T] 1fr [M] auto [B] auto;
  --_CTopBottom: [L h-start b-start] 1fr [C R h-end b-end];
  --_RTopBottom: [T h-start] auto [M h-end b-start] 1fr [B b-end];
}

.m_card .card-head {
  grid-area: h;
  position: unset !important;
}
.m_card .card-body {
  --font-lineheight-3: var(--font-lineheight-2);
  grid-area: b;
  position: unset;
}
.m_card .card-body:focus-within :any-link:not(.card-link) {
  position: relative;
}
.m_card .card-body :is(p, li) {
  -webkit-hyphens: auto;
  hyphens: auto;
}
.m_card .card-foot {
  grid-area: f;
  position: unset !important;
  display: grid;
  place-items: center;
  padding-block: var(--gutter, var(--gap));
}
.m_card .card-title {
  margin-block: 0;
  -webkit-hyphens: none;
  hyphens: none;
}
.m_card .card-link {
  position: var(--parent-position, unset);
  display: inline-block;
  -webkit-text-decoration: none;
  text-decoration: none;
}
.m_card .card-link:hover {
  -webkit-text-decoration: underline;
  text-decoration: underline;
}
.m_card .card-link::after {
  position: absolute;
  content: "";
  cursor: pointer;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}

@media (max-width: 29.999em) {
  .m_card {
    --card-columns: [L] 1fr [C R];
    --card-rows: [T] auto [M] auto [B];
    --card-layout: "h" "b";
    margin-bottom: var(--gutter);
  }
  .m_card .card-head {
    grid-area: T/L/B/R;
  }
  .m_card .card-body,
  .m_card .card-foot {
    grid-area: M/L/B/R;
  }
}
.m_card {
  --h3-color: var(--h2-color);
  --outline-focus: var(--outline-width, calc(var(--border-width) * 2)) solid var(--outline-color, var(--form-element-focus-color, #2c90a8));
  --outline-focus-offset: 3px;
  --outline-shadow: 0 0 0 var(--outline-width) var(--form-element-active-background-color, var(--surface-9)),
  0 0 0 calc(var(--outline-focus-offset) + var(--outline-width)) var(--outline-color);
  outline: var(--card-border);
  contain: paint;
  box-shadow: var(--card-shadow);
  background-color: var(--card-background, var(--panel-background-color));
}
.m_card:focus-within {
  outline: var(--outline-focus);
  outline-offset: var(--outline-focus-offset);
}
.m_card .card-title,
.m_card .card-title .card-link {
  color: var(--color-title, var(--h4-color));
}
.m_card .card-body :is(h4,.h4, h5,.h5, h6,.h6) {
  color: var(--color-title, var(--h4-color));
}
@media (prefers-contrast: more) {
  .m_card:focus-within {
    outline-width: 1px;
    outline-color: transparent;
  }
  .m_card:focus-within .card-link {
    -webkit-text-decoration: underline;
    text-decoration: underline;
  }
}
@media (max-width: 29.999em) {
  .m_card .card-body {
    --border-color: hsl(0, 0%, 78% , 50%);
    --card-background: hsl(0, 0%, 97%, 72%);
    margin: var(--body-inset, 0px);
    margin-top: calc(1% * var(--ratio, 54.05));
    outline: var(--body-inset, 0px) solid var(--border-color);
    background-color: var(--card-background, inherit);
    -webkit-backdrop-filter: saturate(0.4) blur(1em);
    backdrop-filter: saturate(0.4) blur(1em);
  }
}

/* Modifier Bildformat AspectRatio Galore */
.-square {
  --aspect: 1/1;
  --ratio: 100;
  --factor: 1;
}

.-portrait {
  --aspect: 3/4;
  --ratio: 133.3333333333;
  --factor: 0.75;
}

.-landscape {
  --aspect: 4/3;
  --ratio: 75;
  --factor: 1.3333333333;
}

.-golden {
  --aspect: 1.6180339887/1;
  --ratio: 61.803398875;
  --factor: 1.6180339887;
}

.-widescreen {
  --aspect: 16/9;
  --ratio: 56.25;
  --factor: 1.7777777778;
}

.-ultrawide {
  --aspect: 1.85/1;
  --ratio: 54.0540540541;
  --factor: 1.85;
}

.-double {
  --aspect: 2/1;
  --ratio: 50;
  --factor: 2;
}

/* components/accordion */
[data-dir=rtl] > details summary::after {
  float: left;
}

.accordion {
  display: block;
  margin-bottom: var(--spacing);
  border-bottom: var(--border-width) solid var(--accordion-border-color);
  padding: calc(var(--spacing) * 0.5);
}
.accordion summary {
  line-height: var(--font-lineheight-1);
  list-style-type: none;
  cursor: pointer;
  list-style-type: none;
}
.accordion summary::-webkit-details-marker {
  display: none;
  list-style: none;
}
.accordion summary::-moz-list-bullet {
  list-style-type: none;
}
.accordion summary::marker {
  display: none;
  list-style: none;
}
.accordion summary::after {
  content: "";
  display: block;
  width: 1rem;
  height: 1.2rem;
  float: right;
  transform: rotate(-90deg);
  background-image: var(--icon-chevron);
  background-size: 1rem auto;
}
@media (prefers-reduced-motion: no-preference) {
  .accordion summary::after {
    transition: transform var(--transition);
  }
}
.accordion summary:focus {
  outline: none;
}
.accordion summary ~ * {
  margin-top: calc(var(--spacing) * 0.5);
}
.accordion summary ~ * ~ * {
  margin-top: 0;
}
.accordion[open] > summary {
  margin-bottom: calc(var(--spacing) * 0.25);
}
.accordion[open] > summary::after {
  transform: rotate(0);
}
.accordion[open] > summary::after {
  transform: rotate(0);
}
.accordion p {
  margin-bottom: unset;
}
.accordion p:not(:first-of-type),
.accordion ul > li > p {
  border: unset;
}

.accordion.-accent {
  --icon-chevron: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" stroke=\"white\" fill=\"none\" stroke-width=\"2\" stroke-linecap=\"round\"><polyline points=\"1 9 12 20 23 9\" /></svg>");
}
.accordion > :is(p, ul, ol) {
  margin-left: var(--spacing);
  padding-right: var(--spacing);
  padding-block: 0 calc(var(--spacing) * 0.5);
  background-color: var(--surface-9);
  color: var(--color);
}
.accordion:is(.-ghost, .-kontur) summary::after {
  --icon-chevron: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" stroke=\"%232f2f2f\" fill=\"none\" stroke-width=\"2\" stroke-linecap=\"round\"><polyline points=\"1 9 12 20 23 9\" /></svg>");
}

details.accordion {
  padding: 0;
}
details.accordion[open] > summary {
  margin-bottom: 0;
}

.accordion:is(blockquote),
details.accordion summary {
  padding: calc(var(--spacing) * 0.5);
}

.faq-title {
  padding-block: unset;
}

details.faq-item {
  --spacing: var(--size-3);
}
details.faq-item > summary {
  text-align: left;
  background-color: var(--surface-8);
}

.faq-item dd {
  margin: 0 0 var(--size-3) var(--size-2);
}

details[data-dir=rtl] summary::after {
  --fixme: 1;
}

/* components.forms */
/* component.cards */
/* components.forms.dropdown */
/* mixins.icons */
details.dropdown {
  --symbol-size: 0.8em;
}
details.dropdown [data-symbol] {
  --_cells: var(--text-len, max-content) var(--symbol-size, auto);
  --_areas: "text img";
  display: inline-grid;
  gap: var(--widget-gap, var(--gap, 0));
  align-items: center;
  vertical-align: middle;
  grid-template-columns: var(--widget-cells, var(--_cells, auto));
  grid-template-areas: var(--widget-areas, var(--_areas, none));
}
details.dropdown [data-symbol=chevron] {
  --symbol-char: ›;
}
details.dropdown [data-symbol=chevron]::after {
  place-self: center end;
  transform-origin: center;
  transition: transform 240ms ease-out;
  transform: rotate(-90deg);
  background-image: var(--icon-chevron, none);
  background-size: var(--symbol-size, var(--icon-size, 1em));
  width: var(--symbol-size, var(--icon-size, 1em));
  height: var(--symbol-size, var(--icon-size, 1em));
  color: inherit;
}
details.dropdown [data-symbol=chevron] > :first-child {
  grid-area: text;
}
details.dropdown [data-symbol]::after {
  content: "";
  grid-area: img;
  place-self: center;
  transform-origin: center;
  transition: transform 200ms;
}
details.dropdown[open] > [data-symbol]::after {
  transform: rotate(0deg);
}

details.dropdown {
  --form-element-spacing-inline: var(--sizex-4);
  position: relative;
  -webkit-user-select: none;
  user-select: none;
  line-height: normal;
  width: max-content;
  max-width: var(--form-element-max-width);
  background-color: var(--form-element-background-color);
  border-width: var(--border-width);
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--border-radius);
}
@media (max-width: 35.999em) {
  details.dropdown {
    max-width: unset;
  }
}
details.dropdown .img-text {
  --symbol-size: 1.25em;
  --widget-cells: 1fr auto;
  --icon-stroke-width: 2px;
}
details.dropdown > summary:not([role]) {
  list-style-type: none;
}
details.dropdown > summary:not([role])::-webkit-details-marker {
  display: none;
  list-style: none;
}
details.dropdown > summary:not([role])::-moz-list-bullet {
  list-style-type: none;
}
details.dropdown > summary:not([role])::marker {
  display: none;
  list-style: none;
}
details.dropdown > summary {
  --text-len: 1fr;
  max-width: 100%;
  font-weight: inherit;
  padding: var(--form-element-spacing-block) var(--form-element-spacing-inline);
  color: currentColor;
  border-radius: var(--border-radius);
}
details.dropdown > summary:focus {
  outline: var(--outline-focus);
  outline-offset: var(--outline-focus-offset);
}

.dropdown .dropdown-notice {
  display: inline-block;
}

form :is(.dropdown-label, .dropdown-popup) {
  padding: var(--form-element-spacing-block) var(--form-element-spacing-inline);
}

form .dropdown-popup {
  --_list-height: calc(7 * 2em + var(--form-element-spacing-block));
  --_blend-padding: 0.8em;
  contain: layout paint;
  background-color: var(--form-element-background-color);
  border-width: var(--border-width);
  border-style: solid;
  border-color: var(--border-color);
  --border-radius: var(--size-2);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-dark);
}
form .dropdown-popup:focus-within {
  box-shadow: 0 0 1px calc(var(--outline-width) + var(--outline-focus-offset)) var(--form-element-background-color);
  outline: var(--outline-focus, var(--outline-width, var(--border-width)) solid var(--outline-color, currentColor));
  outline-offset: var(--outline-focus-offset);
}
form .dropdown-popup:focus-within:focus:not(:focus-visible) {
  outline: none;
}
@supports (-apple-pay-button-style: inherit) {
  @supports (image-orientation: none) and (scale: 2) {
    form .dropdown-popup:focus-within {
      outline: none;
      box-shadow: var(--outline-shadow);
    }
  }
}

form .dropdown-values {
  margin: 0;
  padding: 0;
  list-style: none;
  max-height: var(--_list-height);
  line-height: 2;
}
form .dropdown-values > .value-item {
  list-style: none;
  display: block;
}
form .dropdown-values .match span {
  background-color: #c7eab2;
  outline: 2px solid #c7eab2;
}
form .dropdown-values .default > span::after {
  content: " ★";
  font-size: 10px;
  vertical-align: super;
  cursor: help;
}
form .dropdown-values .default:hover {
  color: #1c616c;
}
form .dropdown-values label {
  white-space: nowrap;
  display: block;
}
form .dropdown-values label:hover {
  cursor: pointer;
}
@media (max-width: 29.999em) {
  form .dropdown-values label {
    padding-block: 0.6ch;
  }
}
@media (max-width: 23.249em) {
  form .dropdown-values label {
    --input-size-offset: calc((1em + 0.375em) * 1.3);
    padding-left: var(--input-size-offset);
  }
  form .dropdown-values label > input {
    margin-left: calc(-1 * var(--input-size-offset));
  }
}

details.dropdown {
  /* Vue Filter
  	+ .reset {
  		display: none;
  		position: absolute;
  		scale: .8;
  		top: 0;
  		right: 0;
  		height: 100%;
  		aspect-ratio: 1;
  		font-size: 80%;
  		cursor: pointer;
  		border-radius: 100%;
  	}
  */
}
details.dropdown:not([open])[data-dirty] {
  background-blend-mode: hard-light;
  background-color: #aac7dc;
}
details.dropdown:not([open])[data-dirty] summary::after {
  background-image: none;
}
details.dropdown:not([open])[data-dirty] {
  /* Vue Filter
  			+ .reset {
  				filter: grayscale(1);
  				display: inline-grid;
  				place-content: center;
  				color: var(--color-2);
  				background-color: #acdee9;

  				&:focus,
  				&:hover {
  					outline: 2px ridge #acdee9;
  					outline-offset: 2px;
  				}
  			}
  */
}
details.dropdown .dropdown-actions {
  width: auto;
}
details.dropdown .dropdown-actions input[type] {
  --outline-focus-offset: 0;
}
details.dropdown .dropdown-popup {
  position: absolute;
  left: 0;
  z-index: 6;
  margin-top: calc(var(--outline-width) + 2 * var(--outline-focus-offset));
  width: max-content;
  min-width: 100%;
  max-width: calc(100vw - 2.5 * var(--space-inside));
}
details.dropdown .dropdown-header {
  --widget-cells: auto 1fr;
  --widget-gap: 1ch;
  margin-inline: var(--spacing-neg);
  padding-inline: var(--spacing);
  padding-bottom: 0.5ex;
}
details.dropdown .dropdown-values {
  min-width: calc(1.25ex * var(--js_max-length, 0));
}
details.dropdown .line-clamp {
  max-width: calc(100% - 2px);
  margin-inline: 2px;
}

[data-multi=true] .dropdown-actions,
[data-multi=true] .dropdown-values {
  padding-left: calc(var(--outline-focus-offset) + var(--outline-width));
}
[data-multi=true] .value-item {
  padding-right: var(--form-element-spacing-inline);
}

[data-oversize] .dropdown-values {
  position: relative;
  height: var(--_list-height);
  overflow-y: scroll;
  padding-bottom: var(--_blend-padding);
}
@supports (-moz-appearance: inherit) {
  @media (hover) {
    [data-oversize] .dropdown-values {
      scrollbar-width: thin;
      scrollbar-color: #2c90a8 #ccc7c0;
    }
  }
}
[data-oversize] .dropdown-values::after {
  position: -webkit-sticky;
  position: sticky;
  content: "";
  display: block;
  bottom: calc(-1 * var(--_blend-padding));
  left: 0;
  right: 0.5ex;
  height: calc(3 * var(--_blend-padding));
  z-index: 27;
  background: linear-gradient(to bottom, transparent, var(--form-element-background-color) 65%);
}

.dropdown-footer {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--surface-9);
  border-top: var(--border-width) solid var(--border-color);
  margin-block: var(--form-element-spacing-block) calc(-1 * var(--form-element-spacing-block));
}
.dropdown-footer .history {
  -webkit-text-decoration: none;
  text-decoration: none;
  font: normal var(--font-size-4)/1 sans-serif;
  max-width: 1em;
}
.dropdown-footer .history:hover {
  color: #46270f;
}
.dropdown-footer .history.-undo::before {
  content: "⟲";
}
.dropdown-footer .history.-redo::before {
  content: "⟳";
}
.dropdown-footer:has(button:not(:only-child)) {
  gap: 1ex;
  justify-content: space-between;
}
.dropdown-footer:has(button:not(:only-child)) > [type=button] {
  flex: 1 1 100%;
  min-width: unset;
}
.dropdown-footer:has(button:not(:only-child)) > :not([type=button]) {
  min-width: unset;
  flex: 1 1 1%;
}

/* component.cards */
/* component.forms/selection-group */
.selection-group {
  --selection-group-padding: var(--size-2);
  --outline-focus: var(--outline-width) solid #2c90a8;
  display: grid;
  grid-template-columns: [L] repeat(var(--boxes, 2), 1fr) [R];
  gap: var(--grid-spacing-inline, 1rem);
  align-items: center;
}
.selection-group :is(input[type=radio], input[type=checkbox]) {
  position: absolute;
  opacity: 0.0001;
}
.selection-group :is(input[type=radio], input[type=checkbox]):checked + span {
  --icon-stroke-width: 2.5px;
}
:is(.selection-group :is(input[type=radio], input[type=checkbox]):focus-within, .selection-group :is(input[type=radio], input[type=checkbox]):focus, .selection-group :is(input[type=radio], input[type=checkbox]):active) + span {
  outline: var(--outline-focus);
  outline-offset: 2px;
  border-radius: var(--border-radius);
}
@supports (overflow: overlay) and (not (text-decoration: green wavy underline)) {
  @media (-webkit-min-device-pixel-ratio: 1) {
    :is(.selection-group :is(input[type=radio], input[type=checkbox]):focus-within, .selection-group :is(input[type=radio], input[type=checkbox]):focus, .selection-group :is(input[type=radio], input[type=checkbox]):active) + span {
      outline: none;
      box-shadow: 0 0 0 var(--outline-width) var(--surface-9), 0 0 0 var(--outline-focus-offset) #2c90a8;
    }
  }
}
.selection-group > .selection-tab {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: var(--gap, 1rem);
  text-align: center;
  height: 100%;
}
@media (max-width: 35.999em) {
  .selection-group > .selection-tab {
    -webkit-hyphens: auto;
    hyphens: auto;
  }
}
.selection-group > label {
  display: flex;
  height: 100%;
  cursor: pointer;
  text-align: center;
}
.selection-group :is(label, .selection-tab) > :is(a, span) {
  padding: var(--selection-group-padding, 1em);
  width: 100%;
  height: 100%;
  border: 2px solid var(--border-color);
  border-radius: var(--border-radius);
  -webkit-text-decoration: none;
  text-decoration: none;
}
.selection-group :is(label, .selection-tab) > :is(a, span) :is(img, svg) {
  width: 2em;
  height: 2em;
}
.selection-group :is(label, .selection-tab) > :is(a, span) svg:is(:focus, :focus-within) {
  outline: none;
}
.selection-group :is(label, .selection-tab) > :is(a, span).img-text {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--gap, 1rem);
}
.selection-group > button {
  min-width: unset;
  padding: unset;
}
.selection-group label > .img-text,
.selection-group .selection-tab > .img-text {
  --selection-group-padding: var(--size-2);
}
@media (max-width: 29.999em) {
  .selection-group {
    --selection-group-padding: var(--size-1);
  }
}
.selection-group.-trio {
  --boxes: 3;
}
.selection-group.-quart {
  --boxes: 4;
}

.dialog-header > .selection-group:not(:last-child) {
  margin-bottom: var(--spacing);
}

/* req. @container */
.selection-group > label,
.selection-group > button,
.selection-group > a {
  container: sel-group/inline-size;
  -webkit-text-decoration: none;
  text-decoration: none;
}
.selection-group > label > .img-text,
.selection-group > button > .img-text,
.selection-group > a > .img-text {
  --border-width: 2px;
  gap: 1ch;
}

@container sel-group (max-width:9.75em) {
  .selection-group span {
    flex-direction: column;
  }
}
.selection-tab {
  border: unset;
}
.selection-tab[aria-selected=true] > span {
  --icon-stroke-width: 2.5px;
}
.selection-tab:focus-within {
  outline: none;
}
.selection-tab:focus-within > span {
  outline: var(--outline-focus);
  outline-offset: 2px;
}

.selection-tab[aria-selected=true] > span {
  color: #2c90a8;
  border-color: #2c90a8;
}

.selection-group:checked + span {
  color: #2c90a8;
  border-color: #2c90a8;
}
.selection-group :is(label, .selection-tab) > :is(a, span) {
  background-color: var(--surface-10);
}

/* components.card.card */
/* component.cards */
/* component/modal <dialog> */
dialog:modal {
  padding-inline: 0;
  margin-top: var(--spacing);
  max-height: calc(100% - 2 * var(--spacing));
}

.dialog-container {
  color: var(--color);
  background-color: var(--panel-background-color);
  overscroll-behavior: contain;
  isolation: isolate;
  z-index: 7;
}

:not(dialog).dialog-container {
  overscroll-behavior: none;
}
:not(dialog).dialog-container[aria-hidden=true] {
  display: none;
}
:not(dialog).dialog-container {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 1px;
  left: 0;
  z-index: 2707;
  margin: 0 !important;
  padding: 0 !important;
  background-color: hsla(192, 15%, 30%, 0.5);
  box-shadow: inset 0 0 15vmin hsla(26, 20%, 10%, 0.5);
}

[role=document] {
  --btn-offset: var(--sizex-2);
  margin: 0 auto;
}
[role=document].-fullscreen {
  min-width: 36em;
  max-width: 50em;
  margin-inline: auto;
  overflow: hidden auto;
  scrollbar-width: thin;
}
@media (max-width: 49.999em) {
  [role=document].-fullscreen {
    min-width: 90dvw;
  }
}
[role=document] button.close {
  top: 0;
  right: 1.5ex;
  border-radius: 100%;
}

.dialog-container [role=document] {
  width: calc(100dvw - var(--space-inside));
  max-height: 96dvh;
  border-radius: 0.25rem;
}
@media (max-width: 35.999em) {
  .dialog-container [role=document] {
    margin: unset;
    max-height: 100dvh;
    min-width: 100%;
  }
}

.dialog-title {
  -webkit-hyphens: unset;
  hyphens: unset;
}

.dialog-body {
  --gap: var(--spacing);
  min-height: 25vh;
}
.dialog-body legend {
  margin-bottom: unset;
}
.dialog-body fieldset {
  --column-layout: [L] 1fr 1fr [R];
  gap: var(--form-element-spacing);
  padding: unset;
}
.dialog-body .dropdown {
  z-index: 2;
  transform: translateX(calc(var(--border-radius) * -0.2));
}

.dialog-footer {
  display: flex;
  justify-content: space-between;
  position: -webkit-sticky;
  position: sticky;
  bottom: 0;
  margin-bottom: 0;
  z-index: 27;
}

[role=alert] {
  --btn-offset: var(--sizex-2);
  --alert-position: fixed;
  z-index: 42;
}

[role=alert].error {
  position: absolute;
  inset: unset;
  transform: translateY(0);
  transform-origin: top center;
}
[role=alert].error ul {
  list-style-type: none;
}
[role=alert].error ul::-webkit-details-marker {
  display: none;
  list-style: none;
}
[role=alert].error ul::-moz-list-bullet {
  list-style-type: none;
}
[role=alert].error ul::marker {
  display: none;
  list-style: none;
}

:is(dialog, :modal) {
  border: unset;
  border-radius: 10px;
  background-color: var(--panel-background-color);
  animation: fade-in 1s;
}

[role=document],
[role=alert] {
  background-color: var(--panel-background-color);
}

.dialog-title {
  background-color: var(--surface-9);
}

.dialog-footer {
  background-color: var(--surface-9);
  border-top: var(--border-width) solid var(--border-color);
}

[role=alert] {
  border: var(--border-width) solid var(--border-color);
}

.error {
  border: var(--border-width) solid var(--form-element-invalid-border-color);
  border-radius: 10px;
}

@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
  dialog::backdrop,
  :not(dialog).dialog-container {
    background-color: rgba(22, 46, 52, 0.25);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
  }
}

/* component.card-deck */
/* Guide Chapters CardDeck overrides */
@media (min-width: 30em) {
  .m_advisor .c_card-deck :is(.card-head, .card-body, .card-foot) {
    grid-area: auto;
  }
}

@media (max-width: 35.999em) {
  .m_card.-portrait .card-head img {
    --aspect: 1;
    object-fit: cover;
  }
}
main.guides :is(.c_card-deck, [data-cards]).-deck-trio.-deck-slim {
  --column-layout: var(--grid-ram);
}

main.guides .m_intropage :is(.c_card-deck, [data-cards]) {
  --card-columns: var(--_CTopBottom);
  --card-rows: var(--_RTopBottom);
  --card-layout: "h" "b";
}
@media (min-width: 64em) {
  main.guides .m_intropage :is(.c_card-deck, [data-cards]) {
    --deck-items: 3;
  }
}
main.guides .m_intropage :is(.c_card-deck, [data-cards]) > :is(.card-teaser, .page-teaser) {
  min-height: 14rem;
}
main.guides .m_intropage :is(.c_card-deck, [data-cards]) > :is(.card-teaser, .page-teaser).-portrait {
  --card-columns: var(--_CLeftRight);
  --card-rows: var(--_RLeftRight);
  --card-layout: "h b";
}
main.guides .m_intropage :is(.c_card-deck, [data-cards]) > :is(.card-teaser, .page-teaser).-portrait .card-body {
  margin-top: 0;
}
@media (min-width: 64em) {
  main.guides .m_intropage :is(.c_card-deck, [data-cards]) > :is(.card-teaser, .page-teaser).-portrait {
    grid-column: 2/span 4;
  }
}
@media (min-width: 90em) {
  main.guides .m_intropage :is(.c_card-deck, [data-cards]) > :is(.card-teaser, .page-teaser).-portrait {
    --card-columns: var(--_CTopBottom);
    --card-rows: var(--_RTopBottom);
    --card-layout: "h" "b";
    --aspect: 1;
    grid-column: auto/span 2;
  }
}

.guide-chapter .m_card :any-link.btn {
  box-shadow: 0 0 2em var(--surface-10), 0 0 3em var(--surface-10), 0 0 2px var(--btn-shade);
}
.guide-chapter :is(.card-teaser, .page-teaser):not(.-portrait) {
  --card-columns: var(--_CLeftRightCTA);
  --card-rows: var(--_RLeftRightCTA);
  --card-layout: "h b" "h b" "h f";
}
.guide-chapter .m_card.-portrait {
  --card-columns: var(--_CLeftRight);
  --card-rows: var(--_RLeftRight);
  --card-layout: "h b";
}
.guide-chapter .m_card.-portrait .card-body {
  margin-top: 0;
}

@media (min-width: 80em) {
  .c_card-deck.-deck-quart .m_card {
    --card-columns: var(--_CLeftRight);
    --card-rows: var(--_RLeftRight);
    --card-layout: "h b";
  }
  .c_card-deck.-deck-quart .m_card .card-body {
    margin: 0 0 auto 0;
    outline: none;
  }
}

/* component.card-deck */
/* Templates mit vorwiegend Card-Decks */
[data-uid=pflegeimmobilien] .m_partner > .c_card-deck .m_card {
  align-items: start;
  align-content: start;
}
[data-uid=pflegeimmobilien] .m_partner > .c_card-deck.-deck-trio {
  --deck-items: 1;
}
[data-uid=pflegeimmobilien] .m_partner > .c_card-deck.-deck-trio .card-teaser {
  --card-columns: var(--_CTopBottom);
  --card-rows: var(--_RTopBottom);
  --card-layout: "h" "b";
}
@media (min-width: 50em) {
  [data-uid=pflegeimmobilien] .m_partner > .c_card-deck.-deck-trio .card-teaser {
    --card-columns: var(--_CLeftRight);
    --card-rows: var(--_RLeftRight);
    --card-layout: "h b";
    --card-columns: [L h-start] 1fr [C h-end b-start] 1.5fr [R b-end];
  }
}
@media (min-width: 64em) {
  [data-uid=pflegeimmobilien] .m_partner > .c_card-deck.-deck-trio {
    --deck-items: 3;
  }
  [data-uid=pflegeimmobilien] .m_partner > .c_card-deck.-deck-trio .card-teaser {
    --card-columns: var(--_CTopBottom);
    --card-rows: var(--_RTopBottom);
    --card-layout: "h" "b";
  }
}

/* Sonderseiten */
.c_card-deck .m_card {
  min-height: 14em;
}

:is(.m_packages, .m_intropage) :is(.card-teaser, .page-teaser) {
  --card-columns: var(--_CTopBottom);
  --card-rows: var(--_RTopBottom);
  --card-layout: "h" "b" "f";
  --gutter: var(--size-3);
}
:is(.m_packages, .m_intropage) :is(.card-teaser, .page-teaser) .card-foot {
  grid-area: f;
}
@media (max-width: 35.999em) {
  :is(.m_packages, .m_intropage) :is(.card-teaser, .page-teaser) {
    margin-bottom: var(--gutter);
  }
  :is(.m_packages, .m_intropage) :is(.card-teaser, .page-teaser)#experte-manuel-hartmann {
    --ratio: 100;
  }
}
@media (min-width: 36em) {
  :is(.m_packages, .m_intropage) :is(.card-teaser, .page-teaser) {
    --card-columns: var(--_CLeftRightCTA);
    --card-rows: var(--_RLeftRightCTA);
    --card-layout: "h b" "h b" "h f";
  }
}
@media (min-width: 64em) {
  :is(.m_packages, .m_intropage) > .c_card-deck.-deck-slim {
    --deck-items: 4;
  }
  :is(.m_packages, .m_intropage) > .c_card-deck.-deck-slim .m_card {
    grid-column: auto/span 2;
  }
}
:is(.m_packages, .m_intropage) > .c_card-deck.-deck-trio {
  --deck-items: 1;
}
@media (min-width: 50em) {
  :is(.m_packages, .m_intropage) > .c_card-deck.-deck-trio .m_card:not(.-portrait) {
    --card-columns: var(--_CLeftRight);
    --card-rows: var(--_RLeftRight);
    --card-layout: "h b";
  }
}
@media ((min-width: 64em) and (max-width: 79.999em)) {
  :is(.m_packages, .m_intropage) > .c_card-deck.-deck-trio {
    --deck-items: 2;
  }
  :is(.m_packages, .m_intropage) > .c_card-deck.-deck-trio .m_card:not(.-portrait) {
    --card-columns: var(--_CTopBottom);
    --card-rows: var(--_RTopBottom);
    --card-layout: "h" "b";
  }
  :is(.m_packages, .m_intropage) > .c_card-deck.-deck-trio .m_card:not(.-portrait).-last:nth-child(3) {
    --card-columns: var(--_CLeftRightEven);
    --card-rows: var(--_RLeftRight);
    --card-layout: "h b";
    grid-column: 1/-1;
  }
}
@media (min-width: 80em) {
  :is(.m_packages, .m_intropage) > .c_card-deck.-deck-trio {
    --deck-items: 3;
  }
  :is(.m_packages, .m_intropage) > .c_card-deck.-deck-trio .m_card:not(.-portrait) {
    --card-columns: var(--_CTopBottom);
    --card-rows: var(--_RTopBottom);
    --card-layout: "h" "b";
  }
}

.c_card-deck[id=besonderheiten] :is(.card-teaser, .page-teaser) {
  --card-columns: var(--_CLeftRight);
  --card-rows: var(--_RLeftRight);
  --card-layout: "h b";
  grid-column: auto/span var(--span, 2);
}
.c_card-deck[id=besonderheiten] :is(.card-teaser, .page-teaser) .card-body {
  --body-inset: 0px;
  margin: 0;
}
.c_card-deck[id=beratung] {
  --deck-items: 1;
  --gap: 0;
}
@media (min-width: 50em) {
  .c_card-deck[id=beratung] .m_card.card-teaser {
    --aspect: 1/1;
  }
}
@media (min-width: 64em) {
  .c_card-deck[id=beratung] .m_card.card-teaser {
    grid-column: 2/span var(--span, 2);
  }
}
.c_card-deck[id=marketing] .m_card.card-teaser {
  --body-inset: 0px;
  min-height: unset;
}
.c_card-deck[id=marketing] img {
  object-fit: contain;
  --align-block: center;
}
@media (max-width: 29.999em) {
  .c_card-deck[id=marketing] img {
    --align-block: 10%;
  }
}

@media (min-width: 30em) {
  .c_card-deck[id=wia-team] .m_card {
    --card-columns: var(--_CLeftRight);
    --card-rows: var(--_RLeftRight);
    --card-layout: "h b";
  }
}
@media (min-width: 64em) {
  .c_card-deck[id=wia-team] .m_card {
    grid-column: auto/span 2;
  }
  .c_card-deck[id=wia-team] .m_card.-odd:last-of-type {
    grid-column: 2/span 2;
  }
}
@media (min-width: 90em) {
  .c_card-deck[id=wia-team] {
    --deck-items: 6;
  }
  .c_card-deck[id=wia-team] .m_card:is(.card-teaser) {
    grid-column: auto/span 2;
  }
}

.c_card-deck.-supportcenters {
  --deck-items: 1;
}
@media (min-width: 64em) {
  .c_card-deck.-supportcenters {
    --deck-items: 2;
  }
}
@media (min-width: 80em) {
  .c_card-deck.-supportcenters {
    --deck-items: 3;
  }
}
.c_card-deck.-supportcenters .m_card {
  display: block;
  min-height: unset;
}
.c_card-deck.-supportcenters .card-body {
  margin: 0;
  outline: none;
}

[data-uid=kooperationspartner] .c_card-deck {
  --deck-items: 1;
}
[data-uid=kooperationspartner] .c_card-deck .m_card {
  --aspect: 1;
  display: block;
  --card-columns: var(--_CTopBottom);
  --card-rows: var(--_RTopBottom);
  --card-layout: "h" "b";
}
[data-uid=kooperationspartner] .c_card-deck .m_card .card-body {
  margin-top: 0;
}
@media (min-width: 36em) {
  [data-uid=kooperationspartner] .c_card-deck .m_card.card-teaser {
    display: grid;
    --card-columns: var(--_CLeftRight);
    --card-rows: var(--_RLeftRight);
    --card-layout: "h b";
  }
}
@media (min-width: 64em) {
  [data-uid=kooperationspartner] .c_card-deck {
    --deck-items: 2;
  }
  [data-uid=kooperationspartner] .c_card-deck .m_card.card-teaser {
    --card-columns: var(--_CTopBottom);
    --card-rows: var(--_RTopBottom);
    --card-layout: "h" "b";
  }
}
@media (min-width: 80em) {
  [data-uid=kooperationspartner] .c_card-deck .m_card.card-teaser {
    --card-columns: var(--_CLeftRightEven);
    --card-rows: var(--_RLeftRight);
    --card-layout: "h b";
  }
}

/* component.card-deck */
/* Related Page-Teaser overrides */
@media (min-width: 50em) {
  .c_related .c_card-deck {
    --deck-items: 2;
  }
}
@media (min-width: 80em) {
  .c_related .c_card-deck {
    --deck-items: 3;
  }
}

/* component.media */
/* mixins.fallbacks */
/* mixins.selectors */
/* :first-in-island-of-class(.special) – Selects the first element from an island of siblings have a certain class */
/* :last-in-island-of-class(.special) – Selects the last element from an island of siblings have a certain class */
/* :single-in-island-of-class(.special) – Selects the element that forms a single-element island with that a certain class */
main .media-box {
  --column-layout:
  	[L] var(--inline-size, auto)
  	[C] var(--inline-size, auto)
  	[R];
  --row-layout:
  	[T] var(--upper-size, auto)
  	[M] var(--lower-size, auto)
  	[B];
  --area-layout: "nw ne" "sw se";
}
main .media-box :is(img, svg, video, picture) {
  grid-area: var(--grid-full-area);
}

.media-box {
  --area-width: 90%;
  --title-bg: hsl(var(--title-hue, 192) 15% 94% / var(--title-opac, 75%));
  --gap: var(--spacing);
  list-style: none;
  position: relative;
  max-width: 100vw;
  overflow: hidden;
  box-shadow: none;
  isolation: isolate;
  z-index: 0;
  background-image: var(--hero-image);
  background-position: var(--hero-pos, center center);
  background-size: cover;
  margin-inline: calc(-1 * var(--gutter, var(--spacing, 0px)));
}
@media (min-width: 64em) {
  .media-box {
    margin-inline: calc(-2 * var(--gutter, var(--spacing, var(--size-6))));
  }
}
.media-box :is([class*=wrap-], .card-title, .card-body, .card-foot) {
  grid-area: var(--placement);
}
.media-box [class*=wrap-] :is(.card-title, .card-body, .card-foot) {
  margin-block: var(--gap);
  margin-inline: auto;
}
.media-box .card-foot {
  margin-block: var(--gap);
}
.media-box :is(.card-title, .card-body) {
  z-index: 2;
  text-align: center;
  text-wrap: balance;
  max-width: var(--area-width);
}
.media-box :is(.card-title, .card-body, .card-foot).-fullsize {
  --placement: auto / L / span 2 / R;
}
.media-box .inverted {
  border-radius: 5px;
}
.media-box .glow-light .card-title {
  line-height: 2;
}

:is(.-nw, .-ne, .-se, .-sw, .-upper, .-lower) {
  grid-area: var(--placement);
}

.wrap-nw, .-nw {
  --placement: nw;
}

.wrap-ne, .-ne {
  --placement: ne;
}

.wrap-se, .-se {
  --placement: se;
}

.wrap-sw, .-sw {
  --placement: sw;
}

.wrap-fullsize {
  --area-width: 75%;
  --placement: T / L / M / R;
}

.wrap-upper,
.-upper {
  --area-width: 75%;
  --placement: T / L / M / R;
  max-height: 100%;
  place-self: center;
}

.wrap-lower,
.-lower {
  --area-width: 75%;
  --placement: M / L / B / R;
  place-self: center;
  max-height: 100%;
}

.-nw {
  place-self: center start;
}

.-ne {
  place-self: start center;
}

.-se {
  place-self: end center;
}

.-sw {
  place-self: center start;
}

.fade-left {
  -webkit-mask-image: -webkit-linear-gradient(to left, var(--background-color) var(--cross-point, 45%), transparent);
  mask-image: linear-gradient(to left, white var(--cross-point, 45%), transparent);
}

.fade-right {
  -webkit-mask-image: -webkit-linear-gradient(to right, var(--background-color) var(--cross-point, 45%), transparent);
  mask-image: linear-gradient(to right, white var(--cross-point, 45%), transparent);
}

/* components.wia-box */
.wia-box {
  --panel-background-color: var(--brand-light, var(--surface-9));
  --border-color: var(--brand-base, var(--surface-8));
  color: var(--brand-shade, var(--color-2));
  background-color: var(--panel-background-color);
  text-align: left;
}
.wia-box :any-link:not(.btn) {
  color: inherit;
}
.wia-box :is(:is(.-primary, .-secondary, .-accent, .-compl)) {
  box-shadow: unset;
}
.wia-box.-check {
  --icon-fill: none;
  --icon-check: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" stroke=\"%23237789\" fill=\"none\" stroke-width=\"4\" stroke-linecap=\"round\"><polyline points=\"20 6 9 17 4 12\" /></svg>");
}
.wia-box.-check :is(ul, ol) {
  list-style-type: none;
}
.wia-box.-check :is(ul, ol) > li {
  padding-inline: 1ex;
}
.wia-box.-check :is(ul, ol) > li::marker {
  content: var(--icon-check);
  margin-right: calc(var(--spacing) * 0.5);
  margin-top: 1px;
}

details.wia-box[open] {
  outline: var(--border-width) solid var(--border-color);
}
details.wia-box summary {
  color: var(--brand-text);
}
details.wia-box.-ghost > summary {
  background-color: inherit;
  outline-color: inherit;
}
details.wia-box.-kontur > summary {
  outline-width: 2px;
  outline-color: inherit;
}
blockquote.wia-box {
  --icon-size: 2.5em;
  outline-color: var(--border-color);
  margin-inline: auto;
  max-width: min(80%, 80vw, 60ch);
}
blockquote.wia-box .quote-title {
  padding-left: 2ex;
  line-height: normal;
}
blockquote.wia-box .quote-title:is(.h3, .h4) {
  margin-top: -1ex;
}
blockquote.wia-box ul:last-child {
  margin-bottom: unset;
}

blockquote.wia-box:not(:has(.quote-title)) > :nth-child(3) {
  padding-top: var(--spacing);
}

.wia-box:not(.faq-item) {
  margin-top: 3em;
  position: relative;
  border-radius: 1em;
}

.wia-box-icon-wrapper {
  z-index: 30;
  width: calc(0.65 * var(--icon-size));
  height: calc(0.65 * var(--icon-size));
  position: absolute;
  transform: translate(calc(-0.45 * var(--icon-size)), calc(-0.45 * var(--icon-size)));
  transform-origin: top left;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: var(--icon-size);
  font-weight: 500;
}
@media (max-width: 49.999em) {
  .wia-box-icon-wrapper {
    --icon-size: 2.5em;
    /* transform: translate(calc(-.25 * var(--icon-size)), calc(-.6 * var(--icon-size))) */
  }
}
@media (max-width: 23.249em) {
  .wia-box-icon-wrapper {
    scale: 0.7;
  }
}

.box,
.wia-box {
  box-shadow: var(--shadow-dark);
  background-color: var(--panel-background-color);
  outline: 2px solid var(--border-color);
}

.wia-box .quote-title {
  color: inherit;
}
.wia-box.-accent {
  --icon-check: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" stroke="white" fill="none" stroke-width="4" stroke-linecap="round"><polyline points="20 6 9 17 4 12" /></svg>');
}
.wia-box:is(.-ghost, .-kontur) {
  --icon-check: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" stroke="%23237789" fill="none" stroke-width="4" stroke-linecap="round"><polyline points="20 6 9 17 4 12" /></svg>');
}

.wia-box-icon-wrapper {
  --icon-color: var(--brand-accent-400);
  background-color: var(--surface-10);
  outline: inherit;
  color: var(--icon-color);
  user-select: none;
}

.wia-box.-accent .wia-box-icon-wrapper {
  --border-color: var(--brand-base);
  --icon-color: var(--brand-base);
}

.wia-box.-accent.-ghost .wia-box-icon-wrapper {
  --border-color: var(--brand-light) ;
}

.wia-box.-accent.-kontur.-ghost .wia-box-icon-wrapper {
  --icon-color: var(--brand-base);
  --border-color: var(--brand-base);
}

.wia-box.-kontur .wia-box-icon-wrapper {
  background-color: var(--surface-8);
}
.wia-box.-kontur.-accent.-ghost > .wia-box-icon-wrapper {
  background-color: var(--brand-light);
}

/* forms.index */
/* components.forms.dropdown */
/* forms.form */
form {
  --border-color: var(--form-element-border-color);
  --outline-focus: var(--outline-width, calc(var(--border-width) * 2)) solid var(--outline-color, var(--form-element-focus-color, #2c90a8));
  --outline-focus-offset: 2px;
  --outline-shadow: 0 0 0 var(--outline-width) var(--form-element-active-background-color, var(--surface-9)),
  0 0 0 calc(var(--outline-focus-offset) + var(--outline-width)) var(--outline-color);
  --form-element-spacing-block: var(--sizex-3);
  --form-element-spacing-inline: var(--sizex-2);
  --form-element-min-width: 20ch;
  --form-element-max-width: 32ch;
  --form-label-font-weight: var(--font-weight, 600);
  --icon-width: 1ch;
  --icon-size: 3ch;
  --icon-offset: 1ch;
  --icon-pos-start: var(--icon-offset) center;
  --icon-pos-end: center right var(--icon-offset);
}

button,
input,
optgroup,
select,
textarea {
  margin: 0;
  font-size: inherit;
  line-height: var(--line-height, 1.25);
  font-family: inherit;
  letter-spacing: inherit;
}
optgroup {
  font-style: normal;
  padding: 0.4ex 0 0 0;
  margin: 0;
}

select[multiple] option {
  padding: var(--form-element-spacing-block) var(--form-element-spacing-inline);
}

input {
  overflow: visible;
}

select {
  text-transform: none;
}

legend {
  max-width: 100%;
  padding: 0;
  color: inherit;
  white-space: normal;
  margin-block: var(--spacing);
}

textarea {
  overflow: auto;
}

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

:-moz-focusring {
  outline: none;
}

:-moz-ui-invalid {
  box-shadow: none;
}

input {
  background-position: var(--icon-pos-end);
  background-size: var(--icon-size) var(--icon-size);
  background-image: var(--input-icon);
}

input[type=email] {
  --icon-pos-start: unset;
  --icon-pos-end: right 1ch center;
}

fieldset {
  position: relative;
  border: 0;
}

legend {
  font-size: var(--font-size-3);
  color: #2c90a8;
}

label {
  display: inline-block;
  position: relative;
}
label > b {
  font-weight: var(--font-weight-strong);
  margin-bottom: calc(var(--spacing) * 0.5);
}
label > b:first-child {
  display: block;
}
label > b:first-child ~ *,
label > b:first-child ~ * + * {
  display: block;
}
label > input:not([type=checkbox], [type=radio]),
label > select {
  width: 100%;
  max-width: var(--form-element-max-width);
}
label > textarea {
  width: 100%;
}

input,
select,
textarea {
  -webkit-appearance: none;
  appearance: none;
  padding: var(--form-element-spacing-block) var(--form-element-spacing-inline);
  padding-left: calc(var(--form-element-spacing-inline) + 1ch);
}

input:where(:not([type=range], [type=color])),
select,
textarea {
  color: currentColor;
  background-color: var(--form-element-background-color);
  font-weight: inherit;
  border-width: var(--border-width);
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--border-radius);
  transform: translateX(calc(var(--border-radius) * -0.2));
}
input:where(:not([type=range], [type=color])) + .btn,
select + .btn,
textarea + .btn {
  transform: translateX(calc(var(--border-radius) * -0.2));
}
@media (prefers-reduced-motion: no-preference) {
  input:where(:not([type=range], [type=color])),
  select,
  textarea {
    transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
  }
}

textarea {
  resize: vertical;
  border-bottom-right-radius: 0;
  padding-left: calc(var(--border-radius) / 2);
  line-height: normal;
  min-height: calc(3em + 2 * var(--form-element-spacing-inline) + var(--gutter, 0px));
}

select {
  min-width: var(--form-element-min-width);
}

input:focus,
select:focus,
textarea:focus {
  background-color: var(--form-element-active-background-color);
  outline: var(--outline-focus);
  outline-offset: var(--outline-focus-offset);
}
@supports (overflow: overlay) and (not (text-decoration: green wavy underline)) {
  @media (-webkit-min-device-pixel-ratio: 1) {
    input:focus,
    select:focus,
    textarea:focus {
      outline: none;
      box-shadow: var(--shadow-line);
    }
  }
}

:is(input,
select,
textarea)[aria-invalid=false] {
  --icon-pos-end: center right calc(var(--icon-offset) / 2);
  --icon-aria: var(--icon-valid);
  --input-icon: var(--icon-valid) !important;
  outline-color: var(--form-element-valid-border-color);
}
:is(input,
select,
textarea):is(:user-invalid, [aria-invalid=true]) {
  --icon-pos-end: center right calc(var(--icon-offset) / 2);
  --icon-aria: var(--icon-invalid);
  --input-icon: var(--icon-invalid) !important;
  /* background-position: var(--icon-pos-end); */
  outline-color: var(--form-element-invalid-border-color);
}

input:not([type=checkbox], [type=radio], [type=number]):is(:user-invalid, [aria-invalid]) {
  padding-right: calc(var(--form-element-spacing-inline) + var(--icon-size) + var(--icon-offset));
  background-image: var(--icon-aria, var(--input-icon, none));
}

input[type=number] {
  padding-inline: 1ch 4px;
  border-radius: var(--border-radius) 0 0 var(--border-radius);
}
input[type=number][aria-invalid] {
  --icon-pos-end: calc(100% - var(--icon-size));
}

:is(input, textarea)::-webkit-input-placeholder {
  color: var(--form-element-placeholder-color);
  filter: opacity(0.85);
}

input::placeholder,
textarea::placeholder,
select:user-invalid {
  color: var(--form-element-placeholder-color);
  filter: opacity(0.85);
}

select {
  cursor: pointer;
}
@media (hover) and (pointer: fine) {
  select[multiple], select[size] {
    padding-bottom: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
}
select:not([multiple], [size]) {
  --icon-size: .8em;
  padding-right: calc(1ch + var(--icon-width) + var(--icon-offset));
  padding-left: var(--form-element-spacing-inline);
  background-image: var(--icon-chevron);
  background-position: var(--icon-pos-end);
  background-size: var(--icon-size) var(--icon-size);
}
input + small,
select + small,
textarea + small {
  display: inline;
  width: 100%;
  margin-top: calc(var(--spacing) * -0.75);
  margin-bottom: var(--spacing);
  color: var(--form-element-color);
}

form fieldset.personal {
  grid-area: personal;
}
form fieldset.contact {
  grid-area: contact;
}
form fieldset.message {
  grid-area: message;
}
form :is(fieldset, details).additional {
  grid-area: additional;
}
form fieldset.excludes {
  grid-area: excludes;
}
form fieldset.profession {
  grid-area: profession;
}
form fieldset.legals {
  grid-area: legals;
}
form footer {
  grid-area: foot;
}

/* component.cards */
/* forms.buttons */
:is(.btn, :any-link.btn, [type="submit"], [type="reset"]) {
  --border-radius: .8em;
  --border-width: 2px;
  --button-spacing-block: var(--sizex-3);
  --button-spacing-inline: var(--size-3);
  min-width: max-content;
}
:is(.btn, :any-link.btn, [type="submit"], [type="reset"]):where(.-primary) {
  --btn-shade: #46270f;
  --btn-base: #eb6a0a;
  --btn-border: #eb6a0a;
  --btn-hover: #ff8f3b;
  --btn-text: var(--color-10);
  --btn-text-hover: var(--color-10);
}
:is(.btn, :any-link.btn, [type="submit"], [type="reset"]):where(.-secondary) {
  --btn-shade: #243818;
  --btn-base: #62b332;
  --btn-hover: #c7eab2;
  --btn-text: var(--color-10);
  --btn-text-hover: var(--btn-shade);
}
:is(.btn, :any-link.btn, [type="submit"], [type="reset"]):where(.-accent) {
  --btn-shade: #162e34;
  --btn-base: #2c90a8;
  --btn-hover: #acdee9;
  --btn-text: var(--color-10);
  --btn-text-hover: var(--btn-shade);
}
:is(.btn, :any-link.btn, [type="submit"], [type="reset"]):where(.-compl) {
  --btn-shade: #23211d;
  --btn-base: #655e53;
  --btn-hover: #ccc7c0;
  --btn-text: var(--color-10);
  --btn-text-hover: var(--btn-shade);
}

:where(.btn, :any-link.btn, button, input, select, textarea):hover {
  background-color: transparent;
}
:where(.btn, :any-link.btn, button, input, select, textarea):is(:disabled, [aria-disabled=true]) {
  pointer-events: none;
  touch-action: none;
}

:is(.btn, :any-link.btn, [type="submit"], [type="reset"]) {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: var(--gap, );
  height: auto;
  padding: var(--button-spacing-block, var(--sizex-3)) var(--button-spacing-inline, var(--size-3));
  font-size: 1em;
  font-weight: var(--font-weight-strong);
  line-height: normal;
  -webkit-user-select: none;
  user-select: none;
  color: var(--btn-text);
  background-color: var(--btn-base);
  border-width: var(--border-width);
  border-style: solid;
  border-color: var(--btn-border, var(--btn-base));
  border-radius: var(--border-radius);
}
@media (max-width: 49.999em) {
  :is(.btn, :any-link.btn, [type="submit"], [type="reset"]) {
    --button-spacing-block: calc(1.4 * var(--form-element-spacing-block, var(--sizex-3)));
    --button-spacing-inline: calc(1.4 * var(--form-element-spacing-inline, var(--size-3)));
  }
}
:is(.btn, :any-link.btn, [type="submit"], [type="reset"]):focus {
  outline: 1px solid #2c90a8;
  outline-offset: 2px;
  box-shadow: inset 0 0 0.8em 0 var(--btn-border);
  color: var(--btn-text-hover, inherit);
  background-color: var(--btn-hover, inherit);
}
:is(.btn, :any-link.btn, [type="submit"], [type="reset"]):hover {
  color: var(--btn-text-hover, inherit);
  background-color: var(--btn-hover, inherit);
}
:is(.btn, :any-link.btn, [type="submit"], [type="reset"]):focus:not(:focus-visible) {
  outline: none;
}

:any-link.btn[class] {
  text-decoration-line: none;
}
:any-link.btn[class]::before {
  content: "➝ ";
  order: 0;
  margin-left: -0.625ch;
}

.btn {
  --_radii: 0 var(--border-radius) var(--border-radius) 0;
}
.btn[data-dir=rtl] {
  --_radii: var(--border-radius) 0 0 var(--border-radius);
}
.btn.-half {
  --border-width: 1px;
  border-radius: var(--_radii);
  white-space: pre;
  min-width: unset;
}
.btn.-big {
  padding: 2ex 3em;
}
.btn:not(.-primary) {
  --btn-border: var(--btn-base);
}
.btn.-ghost {
  --btn-base: var(--surface-10);
  --btn-border: var(--btn-text);
}
.btn.-ghost.-primary {
  --btn-text: #eb6a0a;
}
.btn.-ghost.-secondary {
  --btn-text: #62b332;
}
.btn.-ghost.-accent {
  --btn-text: #2c90a8;
}
.btn.-ghost.-compl {
  --btn-text: #655e53;
}
.btn.-ghost.-grey {
  --btn-text: #5a5752;
}

.close,
[type=button].close,
.maplibregl-popup-close-button {
  --icon-size: 2em;
  --border-color: var(--surface-8);
  --border-radius: 100%;
  position: absolute;
  z-index: 2;
  translate: var(--close-btn-x, var(--btn-offset, 0.5ex)) var(--close-btn-y, var(--btn-offset, 0.5ex));
  width: var(--icon-size);
  height: var(--icon-size);
  min-width: unset;
  padding: max(1ex, 0.75rem);
  background-image: var(--icon-close);
  background-size: auto calc(var(--icon-size) / 2);
  background-color: var(--surface-10);
  color: transparent;
  border-width: var(--border-width);
  border-style: solid;
  border-color: var(--border-color);
}
.close:hover, .close:focus,
[type=button].close:hover,
[type=button].close:focus,
.maplibregl-popup-close-button:hover,
.maplibregl-popup-close-button:focus {
  background-color: var(--border-color);
}
.close.-sticky,
[type=button].close.-sticky,
.maplibregl-popup-close-button.-sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  translate: var(--spacing) var(--spacing-neg);
  transform-origin: top right;
}

.m_card:not(.-plain):hover .btn {
  --btn-shade: #46270f;
  --btn-base: #eb6a0a;
  --btn-border: #eb6a0a;
  --btn-hover: #ff8f3b;
  --btn-text: var(--color-10);
  --btn-text-hover: var(--color-10);
}

.link-like {
  --form-element-min-width: max-content;
  -webkit-appearance: none;
  appearance: none;
  display: inline-block;
  padding: 0;
  font-size: inherit;
  white-space: nowrap;
  color: #a33f05;
  background-color: transparent;
  border: 0;
  border-radius: unset;
  cursor: pointer;
}
.link-like:active, .link-like:hover {
  -webkit-text-decoration: underline;
  text-decoration: underline;
  background-color: unset;
  color: #eb6a0a;
}
.link-like:focus-visible {
  outline-color: currentColor;
}
.link-like:disabled, .link-like[aria-disabled=true] {
  pointer-events: none;
  touch-action: none;
}

/* component.cards */
/* forms.checkbox-radio */
[type=checkbox],
[type=radio] {
  --outline-focus-offset: 1px;
  width: var(--sizem-5);
  height: var(--sizem-5);
  margin-top: -0.125em;
  margin-right: var(--size-2);
  margin-left: 0;
  padding: initial;
  font-size: inherit;
  vertical-align: middle;
  cursor: pointer;
  background-size: 0.75em auto;
  transform: translateX(0);
}

[type=checkbox] {
  border-radius: 0.25ex;
  border: var(--border-width) solid var(--color-7);
}
[type=checkbox]:indeterminate {
  background-color: var(--surface-7);
  background-image: var(--icon-minus);
}

:is([type=checkbox], [type=radio]):checked {
  background-image: var(--icon-checkbox);
  background-position: center;
}
:is([type=checkbox], [type=radio]):focus {
  outline: var(--outline-focus);
  outline-offset: var(--outline-focus-offset);
}
:is([type=checkbox], [type=radio]):focus:checked {
  outline-offset: 1px;
}
:is([type=checkbox], [type=radio]) ~ label {
  display: inline-block;
  margin-right: 0.375em;
  margin-bottom: 0;
  cursor: pointer;
}

[type=radio] {
  border-radius: 50%;
}
[type=radio]:focus:not(:focus-visible) {
  --type: radio;
  outline: none;
}
[type=radio]:checked {
  background-image: var(--icon-checkbox);
  background-color: #2c90a8;
}

.form-checkbox {
  -webkit-hyphens: auto;
  hyphens: auto;
  display: inline-grid;
  grid-template-columns: auto 1fr;
  grid-template-areas: "box txt";
  align-items: start;
}
.form-checkbox input {
  grid-area: box;
}
.form-checkbox span {
  grid-area: txt;
}
.form-checkbox .note {
  grid-column-start: 2;
  padding-bottom: 1ex;
}

.tipp-checkbox {
  font-size: smaller;
}
.tipp-checkbox > b {
  font-weight: var(--font-weight-strong);
  color: #fff;
  background-color: #62b332;
  border-radius: 1em;
}

[type=checkbox]:checked {
  background-color: #2c90a8;
}

/* forms.alt-input */
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

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

[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}
[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  display: none;
}

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

[type=file],
[type=range] {
  padding: 0;
  border-width: 0;
}

[type=color] {
  width: 2em;
  max-width: 2em !important;
  height: 2em;
  max-height: 2em !important;
  padding: 0.35ex !important;
  border-radius: 1ex !important;
}
[type=color]::-webkit-color-swatch-wrapper {
  padding: 0;
}
[type=color]::-moz-focus-inner {
  padding: 0;
}
[type=color]::-webkit-color-swatch {
  border: none;
  border-radius: calc(var(--border-radius) * 0.5);
}
[type=color]::-moz-color-swatch {
  border: none;
  border-radius: calc(var(--border-radius) * 0.5);
}

form[id] input[type][type=date], form[id] input[type][type=datetime-local], form[id] input[type][type=month], form[id] input[type][type=time], form[id] input[type][type=week],
form[class] input[type][type=date],
form[class] input[type][type=datetime-local],
form[class] input[type][type=month],
form[class] input[type][type=time],
form[class] input[type][type=week] {
  --input-icon: var(--icon-calendar);
  padding-right: calc(1ch + var(--icon-width) + var(--icon-offset));
  background-position: var(--icon-pos-end);
}
form[id] input[type][type=time],
form[class] input[type][type=time] {
  --input-icon: var(--icon-time);
}

@supports (-moz-appearance: inherit) {
  :is(form[id], form[class]) input[type][type=date], :is(form[id], form[class]) input[type][type=datetime-local] {
    --input-icon: none;
    padding-right: 0.4ch;
  }
  :is(form[id], form[class]) input[type][type=date][aria-invalid], :is(form[id], form[class]) input[type][type=datetime-local][aria-invalid] {
    --icon-pos-end: center right calc(.4ch + var(--icon-size));
  }
}
[type=date]::-webkit-calendar-picker-indicator,
[type=datetime-local]::-webkit-calendar-picker-indicator,
[type=month]::-webkit-calendar-picker-indicator,
[type=time]::-webkit-calendar-picker-indicator,
[type=week]::-webkit-calendar-picker-indicator {
  width: var(--icon-width);
  margin-right: calc(-1 * var(--icon-width));
  margin-left: var(--icon-offset);
  filter: opacity(0);
}

[type=file] {
  --_padding-block: calc(var(--form-element-spacing-block) - var(--border-width));
  --border-color: #eb6a0a;
  border: none;
  border-radius: 0;
  background-color: transparent;
  cursor: pointer;
  padding: 4px 0 4px 4px;
}
[type=file]:focus, [type=file]:hover {
  border: none;
  outline: none;
  box-shadow: none;
}
[type=file]::-webkit-file-upload-button {
  margin-left: 0;
  margin-right: calc(var(--form-element-spacing-inline) / 2);
  padding: var(--_padding-block) var(--form-element-spacing-inline);
  border: var(--border-width) solid var(--border-color);
  border-radius: var(--border-radius);
  background-color: var(--background-color);
  color: #eb6a0a;
  font-size: 0.96em;
  text-align: center;
  transform: translateX(calc(var(--border-radius) * -0.2));
}
[type=file]::-webkit-file-upload-button + .btn {
  transform: translateX(calc(var(--border-radius) * -0.2));
}
[type=file]::-webkit-file-upload-button:hover {
  color: var(--color-9);
  border-color: var(--border-color);
  background-color: #ff8f3b;
}
[type=file]::-webkit-file-upload-button:active, [type=file]::-webkit-file-upload-button:focus {
  outline: #62b332;
  outline-offset: 1px;
}
[type=file]::-webkit-file-upload-button:active:not(:focus-visible), [type=file]::-webkit-file-upload-button:focus:not(:focus-visible) {
  outline: none;
}
[type=file]::file-selector-button {
  margin-left: 0;
  margin-right: calc(var(--form-element-spacing-inline) / 2);
  padding: var(--_padding-block) var(--form-element-spacing-inline);
  border: var(--border-width) solid var(--border-color);
  border-radius: var(--border-radius);
  background-color: var(--background-color);
  color: #eb6a0a;
  font-size: 0.96em;
  text-align: center;
  transform: translateX(calc(var(--border-radius) * -0.2));
}
[type=file]::file-selector-button + .btn {
  transform: translateX(calc(var(--border-radius) * -0.2));
}
[type=file]::file-selector-button:hover {
  color: var(--color-9);
  border-color: var(--border-color);
  background-color: #ff8f3b;
}
[type=file]::file-selector-button:active, [type=file]::file-selector-button:focus {
  outline: #62b332;
  outline-offset: 1px;
}
[type=file]::file-selector-button:active:not(:focus-visible), [type=file]::file-selector-button:focus:not(:focus-visible) {
  outline: none;
}

[type=range] {
  max-width: var(--range-max-width, var(--form-element-max-width));
  height: 1.25em;
  background-color: transparent;
  accent-color: var(--range-thumb-hover-color);
}
[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 1em;
  border-radius: var(--border-radius);
  background-color: #acdee9;
}
@media (prefers-reduced-motion: no-preference) {
  [type=range]::-webkit-slider-runnable-track {
    transition: background-color var(--transition);
  }
}
[type=range]::-moz-range-track {
  width: 100%;
  height: 1em;
  border-radius: var(--border-radius);
  background-color: #acdee9;
}
@media (prefers-reduced-motion: no-preference) {
  [type=range]::-moz-range-track {
    transition: background-color var(--transition);
  }
}
[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 1.25em;
  height: 1.25em;
  margin-top: -0.125em;
  border: 2px solid #2c90a8;
  border-radius: 50%;
  background-color: #2c90a8;
  cursor: pointer;
}
@media (prefers-reduced-motion: no-preference) {
  [type=range]::-webkit-slider-thumb {
    transition: background-color var(--transition), transform var(--transition);
  }
}
[type=range]::-moz-range-thumb {
  -webkit-appearance: none;
  width: 1.25em;
  height: 1.25em;
  margin-top: -0.125em;
  border: 2px solid #2c90a8;
  border-radius: 50%;
  background-color: #2c90a8;
  cursor: pointer;
}
@media (prefers-reduced-motion: no-preference) {
  [type=range]::-moz-range-thumb {
    transition: background-color var(--transition), transform var(--transition);
  }
}
[type=range]:hover, [type=range]:focus {
  --range-border-color: var(--range-active-border-color);
}
[type=range]:focus-visible {
  outline-color: currentColor;
  border-radius: var(--border-radius);
}
[type=range]:active {
  accent-color: var(--range-thumb-active-color);
}
[type=range]:active::-webkit-slider-thumb {
  transform: scale(1.25);
}
[type=range]:active::-moz-range-thumb {
  transform: scale(1.25);
}

input[type=search] {
  border-radius: var(--border-radius);
  background-position: var(--icon-pos-start);
  padding-left: calc(var(--form-element-spacing-inline) + 1ch);
}

[type=email]:placeholder-shown {
  --input-icon: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" class="svg-text-mail" width="24" height="24" viewBox="0 0 60 66" fill="none" stroke="%235a5752" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9.979 20.064 3.5 25.5m46.479-8.436-18-14-18 14M60.5 25.5l-6.521-5.436"/> <path class="icon-bg paper" stroke="none" fill="none" d="M54 29.5V17H10v12.5l19 10.707 2.977-2.614L35 40.207 54 29.5Z"/> <path d="M10.5 29.5v-13h43v13"/> <path d="M29.03 39.936 3.479 25.5v36h57v-36L34.927 39.936"/> <path d="m60.479 61.5-28.5-24-28.5 24"/></svg>');
  --icon-width: 3ch;
}
[type=email].icon-subscribe {
  background-size: calc(var(--icon-size) + 1em) var(--icon-size);
}

/* forms.switches */
[type=checkbox][role=switch] {
  --switch-height: var(--sizem-6);
  --switch-ratio: 2;
  --outline-focus: 2px solid var(--brand-accent-400);
  --outline-focus-offset: 2px;
  --_pad: calc(var(--switch-height) / 9.4);
  --_height: calc(var(--switch-height) + var(--_pad));
  --_dot: calc(var(--_height) - 2 * var(--_pad) - var(--border-width, 0));
  --_tf: 100ms ease-in-out;
  width: calc(var(--switch-ratio) * var(--_height) + var(--_pad));
  height: var(--_height);
  margin-inline: var(--size-2);
  flex-shrink: 0;
  padding: var(--_pad);
  line-height: var(--_height);
  border-radius: var(--_height);
  border-color: var(--switch-color);
  color: var(--switch-color);
  filter: saturate(0.2) grayscale(0.4);
}
[type=checkbox][role=switch]:focus:not(:focus-visible) {
  outline: none;
}
[type=checkbox][role=switch]::before {
  content: "";
  display: block;
  width: calc(var(--_dot));
  height: 100%;
  border-radius: 50%;
  border: 1px solid currentColor;
  background-color: currentColor;
  transition: margin-left var(--_tf), background-color var(--_tf), border-color;
}
[type=checkbox][role=switch]:indeterminate {
  background-color: var(--surface-9);
}
[type=checkbox][role=switch]:indeterminate::before {
  border: 1px solid var(--switch-color);
  background-color: var(--surface-8);
  margin-left: calc(50% - var(--_dot) / 2);
}
[type=checkbox][role=switch]:checked {
  background-color: var(--surface-9);
  filter: unset;
  border-color: var(--switch-checked-color);
}
[type=checkbox][role=switch]:checked::before {
  margin-left: calc(100% - var(--_dot));
  color: var(--switch-checked-color);
}
[type=checkbox][role=switch]:disabled::before {
  filter: inherit;
}

/* forms.compounds */
.side-button {
  display: inline-flex;
  flex-direction: row;
  padding: 0;
  border-radius: var(--border-radius);
}
.side-button > input,
.side-button > button {
  transform: none;
}
.side-button > input {
  flex-basis: 100%;
  order: 0;
  border-radius: var(--border-radius) 0 0 var(--border-radius);
  border-inline-width: var(--border-width) 0;
}
.side-button .-half {
  order: 1;
  --border-radius: 1em;
  transform: translateX(0);
  outline: none;
}
.side-button[data-dir=rtl] input {
  order: 1;
  border-radius: 0 var(--border-radius) var(--border-radius) 0;
  border-inline-width: 0 var(--border-width);
}
.side-button[data-dir=rtl] .-half {
  order: 0;
  border-radius: var(--border-radius) 0 0 var(--border-radius);
}
.side-button .loader[data-loading] {
  position: absolute;
}
.side-button button:has([data-loading]) span {
  visibility: hidden;
}

.side-button:focus-within {
  outline: var(--outline-focus);
  outline-offset: var(--outline-focus-offset);
}
.side-button:focus-within > input[type]:focus {
  outline: none;
  box-shadow: none;
}
.side-button:focus-within > button:focus {
  outline: var(--outline-focus);
  outline-offset: 0;
}

.copy-select {
  -webkit-user-select: all;
  user-select: all;
}

.copy-select:focus {
  animation: copy-select 100ms step-end forwards;
}

@keyframes copy-select {
  to {
    -webkit-user-select: text;
    user-select: text;
  }
}
.c_searchbox {
  --form-element-spacing-inline: var(--sizex-3);
  --icon-size: 1.5em;
  --icon-width: 1em;
  --icon-pos-start: left;
  --icon-pos-end: left;
}

/* Fancy Radios / Checkboxen */
.partner-form {
  width: 100%;
}

.partner-form .ctrl-wrapper {
  width: 100%;
  height: 100%;
  border-radius: var(--border-radius);
  margin-top: calc(var(--spacing) * 0.5);
}

.partner-form fieldset > label > :is(input, fieldset, label) {
  margin-top: calc(var(--spacing) * 0.5);
}

.form-wrapper:has(.row-wrapper > .options-wrapper > label > input:not([type=radio])),
.form-wrapper:has(.row-wrapper > .options-wrapper > label > select) {
  max-width: 72ch;
  margin: 0 auto;
}

.options-wrapper {
  display: grid;
  gap: var(--spacing);
  width: 100%;
}
.options-wrapper[data-span="12"] {
  grid-column: 1/-1;
}

.options-wrapper > label {
  text-align: left;
  display: grid;
  grid-template-rows: 1fr auto 1fr;
}
.options-wrapper > label .field-title {
  font-weight: var(--font-weight-semibold);
  margin-bottom: 1ex;
}

.options > label {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.partner-form .options label {
  margin-top: unset;
}

.partner-form .selection-group {
  grid-template-columns: repeat(auto-fit, minmax(250px, 25ch));
  justify-content: center;
}
.partner-form .selection-group span.field-title {
  grid-row: 1/1;
  grid-column: 1/span 12;
}
.partner-form .selection-group span[data-error] {
  grid-row: 3/3;
  grid-column: 1/span 12;
}
.partner-form .selection-group > label > .img-text {
  --widget-areas: "img" "text";
  display: grid;
}
.partner-form .selection-group > label > .img-text img,
.partner-form .selection-group > label > .img-text svg {
  width: auto;
  height: 5em;
}
.partner-form .selection-group > label > .img-text span {
  justify-self: center;
}
.partner-form .selection-group :is([type=checkbox], [type=radio]) {
  padding: calc(var(--spacing) * 2) var(--spacing);
  width: 100%;
  height: 100%;
  border-radius: var(--border-radius);
  z-index: 5;
}
.partner-form .selection-group :is([type=checkbox], [type=radio]):checked {
  background-image: none;
}
.partner-form .selection-group :is([type=checkbox], [type=radio]):focus {
  outline: var(--outline-focus);
  outline-offset: var(--outline-focus-offset);
}
.partner-form .selection-group :is([type=checkbox], [type=radio]):focus:checked {
  outline-offset: 1px;
}

.partner-form .label-wrapper > span {
  max-width: 62ch;
}

.options-wrapper:has(.options) {
  gap: 1ex;
}

.partner-form .field-title:has(+ .options),
.partner-form .options {
  text-align: left;
}

span[data-error] {
  color: red;
  text-align: left;
  font-size: smaller;
  margin-block: 1ex 1rem;
}

.options-wrapper > .selection-group + span[data-error] {
  justify-self: center;
}
@media (min-width: 64.99em) {
  .options-wrapper > .selection-group {
    justify-self: center;
    max-width: calc(1000px + 4rem);
  }
}

.row-wrapper {
  display: grid;
  gap: var(--spacing);
  grid-template-columns: repeat(12, 1fr);
  padding-block: 0;
}
@media (max-width: 479px) {
  .row-wrapper {
    grid-template-columns: 1fr;
  }
}
.row-wrapper > label {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.row-wrapper input:not([type=checkbox], [type=radio]),
.row-wrapper select {
  max-width: 100%;
}
.row-wrapper button[type=submit] {
  margin-left: auto;
}
@media (max-width: 50em) {
  .row-wrapper {
    flex-wrap: wrap;
  }
}

.steps-wrapper {
  max-width: 25em;
  width: 100%;
}
.steps-wrapper .steps {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
.steps-wrapper .steps .step {
  width: 2em;
  height: 2em;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(var(--space-inside) / 2);
  border: 2px solid var(--border-color);
  border-radius: 50%;
  z-index: 1;
  background: var(--surface-10);
  font-size: 1em;
  font-weight: 600;
  color: var(--border-color);
  transition: 200ms ease;
  transition-delay: 0ms;
}
.steps-wrapper .steps .step.active {
  color: var(--brand-accent-400);
  border-color: var(--brand-accent-400);
  transition-delay: 100ms;
}
.steps-wrapper .steps .progress-bar {
  position: absolute;
  width: 100%;
  height: 2px;
  background: var(--border-color);
}
.steps-wrapper .steps .progress-bar .progress {
  position: absolute;
  left: 0;
  width: var(--progress-width);
  height: 100%;
  background: var(--brand-accent-400);
  transition: 300ms ease;
}

.partner-form [type=checkbox],
.partner-form [type=radio] {
  border: var(--border-width) solid var(--color-7);
}
.partner-form .selection-group input[type=checkbox]:checked,
.partner-form .selection-group input[type=radio]:checked {
  border: 2px solid var(--brand-accent-400);
  background-color: transparent;
}
.partner-form .selection-group input[type=checkbox]:checked:focus,
.partner-form .selection-group input[type=radio]:checked:focus {
  border: 2px solid var(--brand-accent-400);
}
.partner-form input[type=checkbox]:checked + label,
.partner-form input[type=radio]:checked + label {
  color: var(--brand-accent-400);
}
.partner-form .field-title:has(+ .selection-group) {
  color: var(--brand-accent-400);
  font-size: var(--size-fluid-5);
}

/* mixins.icons */
/* vars.icons */
/* CSS icons embedded */
:root {
  --icon-checkbox: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke="%23f9f9f9" fill="none" stroke-width="4" stroke-linecap="round"><polyline points="20 6 9 17 4 12" /></svg>');
  --icon-chevron: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke="%23000" fill="none" stroke-width="2" stroke-linecap="round"><polyline points="1 9 12 20 23 9" /></svg>');
  --icon-close: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke="%23000" fill="none" stroke-width="4" stroke-linecap="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>');
  --icon-calendar: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64" stroke="%23000" fill="none" stroke-width="2" fill-rule="evenodd"><path d="M13 10.5H4.5v49h55v-49H51"/><path d="M5 27.5h54m-54-5h54m-41-12h28" /><path fill="%23f9f9f9" d="M18.5 15.5v-10s0-2-2.5-2-2.5 2-2.5 2v10s0 2 2.5 2 2.5-2 2.5-2Zm32 0v-10s0-2-2.5-2-2.5 2-2.5 2v10s0 2 2.5 2 2.5-2 2.5-2Z" /></svg>');
  --icon-invalid: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke="%23900" fill="none" stroke-width="2" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" x2="12" y2="13" y1="6"/><line x1="12" x2="12" y2="18" y1="15"/></svg>');
  --icon-minus: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke="%23f9f9f9" fill="none" stroke-width="4" stroke-linecap="round"><line x1="5" y1="12" x2="19" y2="12"/></svg>');
  --icon-time: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke="%23000" fill="none" stroke-width="1" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>');
  --icon-search: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 64 64" stroke="%23000" stroke-width="2"><path fill="none" d="m35.2 42 18.5 18.3s2 2 5-1c3.1-3 2.1-5 2.1-5l-19-18.8" /><circle fill="none" cx="24" cy="24" r="21" /><path d="m13 14 24 10m-20-1 10 4"/></svg>');
  --icon-valid: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke="%23090" fill="none" stroke-width="3" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>');
  --icon-star: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 64 64" style="fill:%23fff8" stroke="goldenrod" stroke-width="2.4" stroke-linejoin="round"><path d="M32,4L41,23L61,25L46,40L50,60L32,50L14,60L18,40L3,25L23,23L32,4Z"/></svg>');
  --icon-fixme: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" stroke="firebrick" fill="none" stroke-width="4" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>');
}

/* die noch unvollständigen SVG Bubble-Kombis
 * wenn inline SVG verfügbar, den Eintrag hier entfernen */
#wia-icon-person-cross,
#wia-icon-person-question {
  color: firebrick;
}

symbol[id] :where(g,:is(circle, ellipse, path, rect)):not([stroke]) {
  stroke: currentColor;
}

symbol[id] :where(g,:is(circle, ellipse, path, rect)):not([stroke-width]) {
  stroke-width: var(--icon-stroke-width, 1.45px);
}

symbol[id*=bubble] :where(:is(circle, ellipse, path, rect)) {
  stroke-linejoin: round;
}

.icon-bg {
  fill: var(--icon-fill, #fff);
  fill-rule: nonzero;
}

.icon-no-bg {
  fill: none !important;
  fill-rule: nonzero;
  stroke: currentColor;
  stroke-width: var(--icon-stroke-width, 1px);
}

symbol[id] use[transform] {
  transform-origin: center;
}

:where(span, label)[class|=icon] {
  padding-block: 0;
  display: inline-flex;
  align-items: self-end;
  gap: var(--widget-gap, var(--gap, 1ch));
}

[class|=icon] > span:only-of-type {
  line-height: 1;
}

[class|=icon] > span:only-of-type::before {
  display: inline-block;
  height: var(--symbol-size, auto);
  width: auto;
  aspect-ratio: 1;
}

.icon-checkbox > span::before {
  content: var(--icon-checkbox);
}

.icon-chevron > span::before {
  content: var(--icon-chevron);
}

.icon-close > span::before {
  content: var(--icon-close);
}

.icon-calendar > span::before {
  content: var(--icon-calendar);
}

.icon-invalid > span::before {
  content: var(--icon-invalid);
}

.icon-minus > span::before {
  content: var(--icon-minus);
}

.icon-time > span::before {
  content: var(--icon-time);
}

.icon-search > span::before {
  content: var(--icon-search);
}

.icon-valid > span::before {
  content: var(--icon-valid);
}

.icon-star > span::before {
  content: var(--icon-star);
}

.icon-fixme > span::before {
  content: var(--icon-fixme);
}

/* SVG icons */
.icon-24h span::before {
  content: var(--icon-fixme);
}

.icon-account span::before {
  content: var(--icon-fixme);
}

.icon-application span::before {
  content: var(--icon-fixme);
}

.icon-calendar span::before {
  content: var(--icon-fixme);
}

.icon-care span::before {
  content: var(--icon-fixme);
}

.icon-cross span::before {
  content: var(--icon-fixme);
}

.icon-favorite span::before {
  content: var(--icon-fixme);
}

.icon-house span::before {
  content: var(--icon-fixme);
}

.icon-info span::before {
  content: var(--icon-fixme);
}

.icon-lock span::before {
  content: var(--icon-fixme);
}

.icon-map span::before {
  content: var(--icon-fixme);
}

.icon-other span::before {
  content: var(--icon-fixme);
}

.icon-pin span::before {
  content: var(--icon-fixme);
}

#wia-icon-bath:hover path.sm {
  animation: short-bubble 1500ms linear;
}

@keyframes short-bubble {
  0% {
    transform: translate3d(0px, 6px, 0);
    opacity: 0;
  }
  13% {
    transform: translate3d(0px, -2px, 0);
    opacity: 1;
  }
  20% {
    transform: translate3d(1px, -4px, 0);
  }
  30% {
    transform: translate3d(0px, -6px, 0);
  }
  40% {
    transform: translate3d(-1px, -8px, 0);
  }
  50% {
    transform: translate3d(0px, -10px, 0);
  }
  60% {
    transform: translate3d(0px, -12px, 0);
  }
  70% {
    opacity: 0.4;
  }
  80%, 100% {
    transform: translate3d(0, -16px, 0);
    opacity: 0;
  }
}
#wia-icon-stairlift:hover path.seat {
  animation: lifter 1500ms linear alternate;
}

@keyframes lifter {
  0%, 100% {
    transform: translate(0, 0);
  }
  50% {
    transform: translate(-20%, -20%);
  }
  75% {
    transform: translate(20%, 20%);
  }
}
/* Countries */
[class*=flag-] {
  vertical-align: middle;
}

.flag-cz::after {
  content: "${cc}";
}

.flag-de::after {
  content: "${cc}";
}

.flag-do::after {
  content: "${cc}";
}

.flag-es::after {
  content: "${cc}";
}

.flag-nl::after {
  content: "${cc}";
}
