@layer components {
#header {
  --gap: calc(var(--content-width) / 24);
  --font-size: var(--font-size-md);
  display: grid;
  position: fixed;
  grid-template-rows: auto 1fr;
  grid-template-columns: minmax(var(--logo-size), 1fr) auto auto;
  grid-template-areas: "logo toggle" "nav nav" "a11y address";
  column-gap: var(--gap);
  align-items: center;
  z-index: 10;
  inset-block-start: 0;
  inset-inline: 0;
  border-block-end: var(--border-line) var(--color-accent);
  background-color: var(--data-color-secondary);
  padding: calc((var(--header-height) - var(--logo-size)) / 2) calc(var(--content-padding) / 2);
  max-block-size: 100%;
  color: var(--color-white);
  font-size: var(--font-size);
}
@media (min-width: 960px) {
  #header {
    --font-size: var(--font-size-sm);
    grid-template-areas: "logo nav address a11y";
    column-gap: var(--gutter-var);
    padding: calc((var(--header-height) - var(--logo-size)) / 2) calc(var(--content-padding) / 8);
  }
}
@media (min-width: 1260px) {
  #header {
    --font-size: var(--font-size-md);
  }
}
@media (min-width: 1620px) {
  #header {
    column-gap: var(--gap);
  }
}
#header > .logo {
  grid-area: logo;
  inline-size: fit-content;
}
#header > .logo img {
  inline-size: auto;
  max-inline-size: min(100%, 32rem);
  block-size: var(--logo-size);
  object-fit: contain;
}
#header .a11y {
  display: flex;
  display: none;
  grid-area: a11y;
  gap: var(--gutter);
  margin: 0;
}
@media (min-width: 960px) {
  #header .a11y {
    display: block;
  }
}
#header[data-menu-open=true] .a11y {
  display: block;
}
#header > .toggle {
  grid-area: toggle;
  margin-inline-start: auto;
}
#header > .nav {
  grid-area: nav;
  inline-size: 100%;
  block-size: 100%;
  overflow-y: auto;
  overscroll-behavior-block: contain;
}
@media (min-width: 960px) {
  #header > .nav {
    justify-content: end;
    overflow: visible;
    block-size: auto;
  }
}
#header > .nav nav {
  inline-size: 100%;
}
#header .address {
  display: none;
  grid-area: address;
  font-size: 3.5rem;
}
@media (min-width: 960px) {
  #header .address {
    display: block;
    font-size: 2.5rem;
  }
}
@media (min-width: 1620px) {
  #header .address {
    font-size: 3.5rem;
  }
}
#header .address :any-link {
  margin-block: 0;
}
#header .address ul {
  display: flex;
  flex-direction: row;
  gap: calc(var(--gutter) / 2);
}
#header[data-menu-open=true] .address {
  display: block;
}

#main-menu {
  --header-padding: calc((var(--header-height) - var(--logo-size)) / 2);
}
@media (min-width: 960px) {
  #main-menu {
    transition: none;
  }
}
#main-menu .nav-wrap > ul {
  margin-block: calc(var(--gutter) / 2) var(--gutter);
}
@media (min-width: 960px) {
  #main-menu .nav-wrap > ul {
    margin-block: 0;
  }
}
@media (min-width: 960px) {
  #main-menu li:where(:hover, :focus-visible, :focus-within) .drop-down {
    grid-template-rows: 1fr;
    padding-block-start: calc(var(--header-padding) + var(--font-size) - 1rem);
    border-block-end: none;
  }
}
#main-menu li[has-dropdown=true] .drop-down {
  grid-template-rows: 1fr;
  padding-block-end: calc(var(--gutter) / 2);
  border-block-end: 0.2rem solid var(--color-accent);
}
@media (min-width: 960px) {
  #main-menu li[has-dropdown=true] .drop-down {
    padding-block-start: calc(var(--header-padding) + var(--font-size) - 1rem);
    border-block-end: none;
  }
}
#main-menu ul {
  display: flex;
  flex-flow: column nowrap;
  align-items: end;
  padding-inline: 0.25em;
  padding-block: calc(var(--gap) / 4);
  inline-size: 100%;
}
@media (min-width: 960px) {
  #main-menu ul {
    flex-direction: row;
    gap: calc(var(--gutter-var) / 2);
    text-align: end;
  }
}
@media (min-width: 1620px) {
  #main-menu ul {
    gap: var(--gutter-var);
  }
}
#main-menu ul li {
  position: relative;
  inline-size: 100%;
  max-inline-size: revert;
}
#main-menu .drop-down {
  transition: grid-template-rows var(--transition, 250ms ease-out), padding-block-start var(--transition, 250ms ease-out);
  display: grid;
}
@media (min-width: 960px) {
  #main-menu .drop-down {
    grid-template-rows: 0fr;
  }
}
#main-menu .drop-down > * {
  overflow: hidden;
}
@media (min-width: 960px) {
  #main-menu .drop-down {
    position: absolute;
    transform: translateX(-50%);
    inset-inline-start: 50%;
    inline-size: 33rem;
    overflow: hidden;
  }
  #main-menu .drop-down > * {
    grid-row: 1/span 2;
  }
}
#main-menu .drop-down .icon-nav,
#main-menu .drop-down .drop-down {
  display: none !important;
}
#main-menu .drop-down ul {
  gap: 0.5em;
  margin-inline: 0.25em;
  padding: 0;
}
@media (min-width: 960px) {
  #main-menu .drop-down ul {
    flex-direction: column;
    background-color: var(--data-color-secondary);
    padding: 0;
    text-align: left;
  }
}
#main-menu .drop-down ul::after {
  position: absolute;
}
@media (min-width: 960px) {
  #main-menu .drop-down li {
    padding: 0.3em 2em;
  }
  #main-menu .drop-down li:last-child {
    padding-block-end: 1em;
  }
}
#main-menu .drop-down li a {
  border-block-end: none;
  padding-block: 0;
}
#main-menu .icon-nav {
  margin-inline-start: 1em;
}
@media (min-width: 960px) {
  #main-menu .icon-nav {
    position: absolute;
    transform: translateX(-50%);
    z-index: 1;
    margin: 0;
    inset-block-start: 100%;
    inset-inline-start: 50%;
  }
}

.nav-link:not(:last-child)::after {
  opacity: 0;
}

.nav-wrap {
  overflow-y: auto;
}
@media (min-width: 960px) {
  .nav-wrap {
    overflow: visible;
  }
}
.nav-wrap .nav-link {
  display: block;
  position: relative;
  padding-block: calc(var(--gutter) / 2);
}
@media (min-width: 960px) {
  .nav-wrap .nav-link {
    border-block-end: none;
    padding-block: 0;
  }
}
.nav-wrap .nav-link::after {
  position: absolute;
  transition: transform var(--transition);
  inset-block-end: 0;
  inset-inline: 0;
  background-color: var(--color-accent);
  block-size: 0.2rem;
  content: "";
}
@media (min-width: 960px) {
  .nav-wrap .nav-link::after {
    transform: scaleX(0);
  }
}
.nav-wrap [role=link][aria-current=page], .nav-wrap [data-current-ancestor=true],
.nav-wrap .nav-link:where(:hover, :focus-visible) {
  color: var(--color-accent);
  text-decoration: none;
}
.nav-wrap [role=link][aria-current=page]::after, .nav-wrap [data-current-ancestor=true]::after,
.nav-wrap .nav-link:where(:hover, :focus-visible)::after {
  transform: scaleX(1);
}
@media (min-width: 960px) {
  .nav-wrap [role=link][aria-current=page]::after, .nav-wrap [data-current-ancestor=true]::after,
  .nav-wrap .nav-link:where(:hover, :focus-visible)::after {
    opacity: 1;
  }
}
.nav-wrap li ul .nav-link::after {
  content: none;
}

#a11y-theme {
  --color-text: var(--button-link-color);
  display: flex;
  position: relative;
  align-items: center;
  background-color: var(--color-background);
  inline-size: fit-content;
  color: var(--color-text);
}
#a11y-theme select {
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0.5rem;
  background-color: transparent;
  background: var(--button-bg-color);
  padding-inline: calc(var(--font-size) + 1.5em) var(--font-size);
  block-size: 3.25em;
  color: var(--button-link-color);
  font-size: var(--font-size);
}
@media (min-width: 1620px) {
  #a11y-theme select {
    inline-size: auto;
    block-size: 3.25em;
    font-size: var(--font-size);
    line-height: var(--font-size);
  }
}
#a11y-theme .a11y-theme-preview-icon {
  position: absolute;
  inset: 0.625em auto 0 0.25em;
  pointer-events: none;
  font-size: calc(var(--font-size) + 0.8rem);
}
@media (min-width: 960px) {
  #a11y-theme .a11y-theme-preview-icon {
    inset: 1.4rem auto 0 0.57rem;
  }
}
@media (min-width: 1260px) {
  #a11y-theme .a11y-theme-preview-icon {
    inset: 1.9rem auto 0 0.87rem;
  }
}
@media (min-width: 1620px) {
  #a11y-theme .a11y-theme-preview-icon {
    inset: 0.625em auto 0 0.25em;
  }
}
#a11y-theme .a11y-theme-preview-icon > * {
  position: absolute;
  transition: opacity var(--transition);
}
@media (prefers-color-scheme: dark) {
  #a11y-theme .a11y-theme-preview-icon .fa-moon {
    opacity: 1;
  }
  #a11y-theme .a11y-theme-preview-icon .fa-sun {
    opacity: 0;
  }
}
@media (prefers-color-scheme: light) {
  #a11y-theme .a11y-theme-preview-icon .fa-moon {
    opacity: 0;
  }
  #a11y-theme .a11y-theme-preview-icon .fa-sun {
    opacity: 1;
  }
}
#a11y-theme .a11y-theme-preview-icon:where([data-theme=light] *) .fa-moon {
  opacity: 0;
}
#a11y-theme .a11y-theme-preview-icon:where([data-theme=light] *) .fa-sun {
  opacity: 1;
}
#a11y-theme .a11y-theme-preview-icon:where([data-theme=dark] *) .fa-moon {
  opacity: 1;
}
#a11y-theme .a11y-theme-preview-icon:where([data-theme=dark] *) .fa-sun {
  opacity: 0;
}
#a11y-theme .a11y-theme-select-icon {
  position: absolute;
  transform: scale(0.6667);
  opacity: 0.825;
  inset-inline-end: 0.25em;
  pointer-events: none;
}

.a11y > button {
  display: none;
}
.a11y > #a11y-menu {
  display: contents !important;
}

#footer {
  --footer-link-color: inherit;
  --footer-text-color: var(--color-white);
  --footer-hover-color: var(--color-primary);
  --section-bg: var(--section-bg--opaque);
  --color-selection: var(--footer-text-color, var(--color-primary));
  --color-accent: var(--section-bg--dark, var(--color-primary));
  --color-text: var(--footer-text-color, var(--section-bg--dark, var(--color-black)));
  --link-color: var(--footer-link-color, var(--color-text));
  --link-color-extra: var(--footer-hover-color, var(--color-text));
  --color-bg: var(--color-secondary);
  --color-bg-extra: var(--color-tertiary, var(--color-bg));
  background: var(--section-bg--transparent, color-mix(in oklch, transparent var(--section-bg--opacity), var(--color-bg))) var(--section-bg--opaque, linear-gradient(to var(--section-bg--gradient-direction), var(--color-bg) 0%, var(--color-bg) 100%));
  color: var(--color-text);
}

#footer ::selection {
  --color-text: var(--footer-text-color, var(--section-bg--dark, var(--color-black)));
  --color-selection: var(--footer-text-color, var(--color-text, inherit));
}

#footer :where(h1, .h1, h2, .h2, h3, .h3, h4, .h4),
#footer ::marker {
  color: var(--section-header-color, var(--header-color, var(--color-text)));
  font-weight: 600;
}
@media (min-width: 960px) {
  #footer :where(h1, .h1, h2, .h2, h3, .h3, h4, .h4),
  #footer ::marker {
    margin-block-end: var(--gutter);
  }
}

#footer {
  --section-bg: var(--section-bg--opaque);
  margin-block-start: auto;
  background-color: var(--color-bg);
  padding-block: 0 calc(var(--gutter) * 2 / 3);
  font-size: var(--font-size-sm);
  line-height: 1.5;
}
#footer :where(h1, .h1, h2, .h2, h3, .h3, h4, .h4) {
  color: inherit;
  font-size: var(--font-size-md);
}

.footer-wrap {
  padding-inline: calc(var(--content-padding));
}

#footer :any-link {
  color: var(--link-color);
  text-decoration: var(--link-decoration);
}

#footer :any-link:where(:focus-visible, :hover) {
  color: var(--link-color-extra);
}

#footer .overlay {
  margin-block-end: 0;
}
#footer nav > ul {
  gap: calc(var(--gutter) / 3);
}
#footer p {
  margin-block-end: 0;
}

.footer-holder {
  padding-block-start: calc(var(--gutter-var) * 1.5);
  padding-block-end: var(--gutter);
}
.footer-holder > .row {
  justify-content: space-between;
}

.footer-bar {
  padding-block-start: var(--gutter);
  border-block-start: var(--border-line-thick) var(--color-accent);
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  gap: calc(var(--gutter) / 2) var(--gutter);
}
@media (min-width: 960px) {
  .footer-bar {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }
}

#social-menu {
  display: flex;
  gap: 1rem;
  order: -1;
}
@media (min-width: 960px) {
  #social-menu {
    order: initial;
  }
}
#social-menu .icon-fa {
  font-size: 4rem;
}

#legal-menu ul {
  display: flex;
  flex-wrap: wrap;
}
#legal-menu li:not(:last-child)::after {
  content: "";
  inline-size: 0.1rem;
  block-size: 1.2rem;
  display: inline-block;
  background: var(--color-text);
  margin-inline-start: calc(var(--gutter) / 3);
}

.footer-copy {
  margin-block: calc(var(--gutter) / 2);
}
@media (min-width: 960px) {
  .footer-copy {
    text-align: center;
  }
}

table {
  --color-extra: color-mix(
  	in oklch,
  	transparent,
  	color-mix(in oklch, var(--color-black), var(--color-accent) 67.5%) var(--bg-transparency)
  );
  --color-extra: color-mix(
  	in oklch,
  	transparent,
  	oklch(from var(--color-accent) 50% c h) var(--bg-transparency)
  );
  contain: content;
  border: var(--border-line) var(--color-extra);
  background-color: var(--color-bg);
  inline-size: 100%;
  max-inline-size: 100%;
  overflow-x: auto;
  overflow-y: clip;
  line-height: 1.25;
  font-variant-numeric: tabular-nums;
}

table :is(td, th) {
  vertical-align: top;
  border-top: none;
  padding: 0.625em 0.425em;
}

table th {
  min-inline-size: 12rem;
  font-weight: bolder;
}

table td {
  min-inline-size: 8rem;
  text-align: end;
}

table tr:nth-child(odd) {
  background-color: var(--color-extra);
}

table tr:first-child {
  border-block-end: var(--border-line) var(--color-extra);
}

table tr > :not(:last-child) {
  border-inline-end: var(--border-line) var(--color-extra);
}

table tr > :first-child {
  border-inline-end: var(--border-line) var(--color-extra);
}

form {
  display: flex;
  flex-flow: column nowrap;
  gap: 1.25em;
}

form > div:first-child:not([class]) {
  position: absolute;
  visibility: hidden;
}

form > * {
  margin-block-end: 0;
}

form [role=toolbar] > * {
  text-align: right;
}

fieldset {
  margin: 0;
  border: none;
  padding: 0;
}

label > span:first-child {
  display: inline-block;
  margin-block-end: 0.325em;
}

label .required {
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  vertical-align: 0.15em;
  margin-inline: 0.125em;
  border-radius: 0.15rem;
  background-color: color-mix(in srgb, var(--color-bg), currentColor 16.25%);
  padding: 0.15em 0.25em;
  color: color-mix(in oklch, var(--color-black), var(--color-secondary) 67.5%);
  color: oklch(from var(--color-secondary) 50% c h);
  color: var(--color-accent);
  font-size: 0.725em;
  line-height: 1;
}

#content > :nth-child(odd) label .required {
  background-color: color-mix(in srgb, var(--color-bg), currentColor 1.75%);
}

form .error-message {
  font-size: 0.9em;
  margin-block-start: -1.25em;
  padding-inline-start: 0.125em;
  padding-block-start: 0.125em;
  line-height: 1.425;
  color: red;
}

:where(select, textarea, input):not([type=checkbox],
[type=radio],
[type=submit],
[type=reset],
[type=button],
[type=image],
[type=range]) {
  border: var(--border-line) var(--color-accent);
  border-radius: 0;
  background-color: var(--color-bg);
  padding: 0.5em;
  inline-size: 100%;
  font-size: max(1.6rem, var(--font-size-sm));
}

form table.table td {
  text-align: left;
}

:any-link {
  transition: color var(--transition);
  color: var(--link-color, inherit);
  text-decoration: none;
}

[role=link][aria-current=page] {
  opacity: calc(100% - var(--bg-transparency));
  color: var(var(--footer-link-color), var(--color-accent));
  text-decoration: underline;
  text-decoration-thickness: 0.075em;
  text-underline-offset: 0.125em;
}

#content :any-link:not(.button) {
  text-decoration: var(--link-decoration);
}

:any-link:not(.button):where(:hover, :focus-visible) {
  color: var(--color-accent);
}

:any-link,
button,
details,
summary,
input,
select,
textarea,
label {
  cursor: pointer;
}

button,
input:where([type=checkbox], [type=radio], [type=submit], [type=button], [type=reset]) {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}

button,
input:where([type=submit], [type=button], [type=reset]) {
  appearance: none;
  margin: 0;
  border: transparent;
  background-color: transparent;
  padding: 0;
  color: inherit;
  font: inherit;
}

textarea {
  min-block-size: calc(4.5em + (0.5em + 0.1rem) * 2);
  min-block-size: calc(3lh + (0.5em + 0.1rem) * 2);
  resize: vertical;
  line-height: 1.5;
}

.frame-buttons-menu ul > li > :any-link,
.button {
  display: inline-block;
  transition: filter var(--transition);
  background-color: var(--button-bg-color, var(--color-accent));
  padding: 0.6636em 1.9em;
  color: var(--button-link-color, var(--link-color));
  -webkit-user-select: none;
  user-select: none;
  border-radius: 0.5rem;
  font-weight: 600;
}

.frame-buttons-menu ul > li > :any-link:where(:hover, :focus-visible),
.button:where(:hover, :focus-visible) {
  filter: brightness(0.8) contrast(1.6) saturate(0.8);
}

:where(p :any-link):not(:where(:has(> span[class*=fa-]), .button, .btn))::after {
  transition: color var(--transition);
  color: var(--link-color-extra, var(--color-accent));
}

/* headlines */
:where(h1, .h1, h2, .h2, h3, .h3, h4, .h4) {
  display: block;
  margin-block-start: 0;
  margin-block-end: 0.5em;
  inline-size: fit-content;
  /*max-inline-size: 64ch;*/
  color: var(--header-color, inherit);
  line-height: 1.25;
  font-family: var(--font-family-secondary);
  -webkit-hyphens: auto;
  hyphens: auto;
  letter-spacing: -0.01875em;
}
:where(h1, .h1, h2, .h2, h3, .h3, h4, .h4):is(.underline) {
  padding-block-end: var(--gutter);
  margin-block-end: var(--gutter);
}
:where(h1, .h1, h2, .h2, h3, .h3, h4, .h4):is(.underline)::after {
  content: "";
  height: 0.3rem;
  background: var(--color-accent);
  display: block;
  position: absolute;
  bottom: 0;
  inset-inline: 0;
}

@media (prefers-color-scheme: light) {
  :where(h1, .h1, h2, .h2, h3, .h3, h4, .h4) {
    --header-color: var(--color-secondary);
  }
}
@media (prefers-color-scheme: dark) {
  :where(h1, .h1, h2, .h2, h3, .h3, h4, .h4) {
    --header-color: inherit;
  }
}
[data-theme=light] :where(h1, .h1, h2, .h2, h3, .h3, h4, .h4) {
  --header-color: var(--color-secondary);
}
[data-theme=dark] :where(h1, .h1, h2, .h2, h3, .h3, h4, .h4) {
  --header-color: inherit;
}
:where(h1, .h1, h2, .h2, h3, .h3, h4, .h4):not(header :where(h1, .h1, h2, .h2, h3, .h3, h4, .h4)):not(:first-child):not(:where(h1, .h1, h2, .h2, h3, .h3, h4, .h4) + :where(h1, .h1, h2, .h2, h3, .h3, h4, .h4)) {
  margin-block-start: 1.25em;
}

:where(h1, .h1) {
  font-size: var(--font-size-xl);
}

:where(h2, .h2) {
  font-size: var(--font-size-lg);
}

:where(h1, .h1, h2, .h2) {
  font-weight: bold;
}

:where(h3, .h3) {
  font-size: var(--font-size-md);
}

:where(h4, .h4) {
  font-size: var(--font-size-md);
}

:where(h2, .h2, h3, .h3, h4, .h4) {
  font-family: var(--font-family-secondary);
}

:root {
  --animate-duration: 1s;
  --animate-delay: 1s;
  --animate-repeat: 1;
}

[id=hero] {
  contain: content;
  min-block-size: calc(var(--content-height) * 4 / 5);
}
[id=hero]:has(video) {
  min-block-size: var(--content-height);
}
[id=hero] .media,
[id=hero] .media * {
  position: absolute;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
}
[id=hero] .media {
  view-timeline: --view-timeline-hero-media vertical;
  view-timeline: --view-timeline-hero-media y;
  z-index: -1;
}
[id=hero] .media img {
  --object-position-y: 25%;
  will-change: transform;
}
[id=hero] .content {
  z-index: 1;
  padding-block: calc(var(--content-height) * 1 / 3);
  block-size: 100%;
}
[id=hero] .contain {
  max-inline-size: var(--content-width-alt);
}
[id=hero] .hero-line {
  --background-color: color-mix(in hsl, var(--data-color-secondary), transparent 20%);
  --border-radius: 0.5rem;
  --header-color: var(--color-white);
  --text-block-padding: 2rem ;
  --text-inline-padding: 2.6rem;
  display: block;
  animation-name: in-left;
  animation-duration: var(--animate-duration);
  animation-fill-mode: both;
  animation-delay: var(--animate-delay);
  background-color: var(--background-color);
  color: var(--header-color);
}
@media (min-width: 960px) {
  [id=hero] .hero-line {
    max-inline-size: fit-content;
    margin-block-end: calc(var(--gutter) / 2);
    background: none;
  }
  [id=hero] .hero-line + .hero-line {
    max-inline-size: fit-content;
  }
}
[id=hero] .hero-line strong {
  font-weight: 900;
}
[id=hero] .hero-line span {
  display: inline-block;
  padding: var(--text-block-padding) var(--text-inline-padding);
  font-weight: 600;
  text-wrap: balance;
  overflow-wrap: break-word;
}
@media (min-width: 960px) {
  [id=hero] .hero-line span {
    border-radius: var(--border-radius);
    background-color: var(--background-color);
  }
}
[id=hero] .hero-line:first-child span {
  padding-block-end: 0;
}
@media (min-width: 960px) {
  [id=hero] .hero-line:first-child span {
    padding-block-end: var(--text-block-padding);
  }
}
[id=hero] .hero-line:last-child span {
  padding-block-start: 0;
}
@media (min-width: 960px) {
  [id=hero] .hero-line:last-child span {
    padding-block-start: var(--text-block-padding);
  }
}
[id=hero] :where(h1, h2, h3) {
  font-weight: 600;
}

#nohero-title h1 {
  margin-block-end: 0;
}

@supports (view-timeline: none) {
  #hero .media img {
    animation-name: parallax;
    animation-timeline: --view-timeline-hero-media;
    animation-duration: 1ms;
    animation-timing-function: linear;
    animation-fill-mode: both;
    animation-range-start: exit-crossing 1.6rem;
    animation-range-end: exit-crossing calc(100% + 1.6rem);
  }
}
@keyframes parallax {
  to {
    transform: translateY(62.5%);
  }
}
@keyframes scale {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.1);
  }
}
@keyframes in-left {
  0%, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0) scaleX(3);
    transform: translate3d(-3000px, 0, 0) scaleX(3);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0) scaleX(1);
    transform: translate3d(25px, 0, 0) scaleX(1);
  }
  75% {
    -webkit-transform: translate3d(-10px, 0, 0) scaleX(0.98);
    transform: translate3d(-10px, 0, 0) scaleX(0.98);
  }
  90% {
    -webkit-transform: translate3d(5px, 0, 0) scaleX(0.995);
    transform: translate3d(5px, 0, 0) scaleX(0.995);
  }
  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}
.embed-responsive-item {
  aspect-ratio: 1/1;
  inline-size: 100%;
  block-size: 100%;
}

@media (min-width: 744px) {
  .embed-responsive-item {
    aspect-ratio: 3/2;
  }
}
.gallery {
  inline-size: 100%;
}

.gallery:has(> .video) {
  aspect-ratio: 16/9;
  inline-size: 100%;
}

.gallery:has(> .video) :where(.video-embed, .video-embed > *) {
  inline-size: 100% !important;
  block-size: 100% !important;
}

.text-gallery.media-inline-start {
  flex-direction: row;
  align-items: start;
  flex-wrap: wrap;
}
@media (min-width: 744px) {
  .text-gallery.media-inline-start {
    flex-wrap: nowrap;
  }
}

.text-gallery.media-inline-end {
  flex-direction: row-reverse;
  align-items: end;
}

.text-gallery.media-inline-center {
  align-items: center;
}

.text-gallery.media-block-start {
  flex-direction: column;
  align-items: start;
}

.text-gallery.media-block-end {
  flex-direction: column;
  align-items: end;
}

.text-gallery.media-block-center {
  align-items: center;
}

.upload-list .upload-item > * {
  display: inline-block;
  margin-block: 0;
}

.upload-list .upload-item-media {
  margin-inline-end: 0.5ch;
  max-inline-size: 1em;
}

.news-single-teaser {
  margin-block-end: 1em;
}

.news-single-meta {
  margin-block-end: 1em;
  padding-inline: 0;
}

.news-single-content {
  margin-block-end: var(--gutter);
}

@media (min-width: 960px) {
  .news-single-content p {
    margin-inline-start: var(--gutter);
  }
}
.news-img-caption {
  opacity: 0.9;
  margin-block-start: calc(var(--gutter) / 4);
  font-size: 0.9em;
}

.pagination {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--gutter) / 2);
  justify-content: center;
  align-items: center;
  padding: 0;
  margin-block: var(--gutter);
}
.pagination li {
  margin-block-end: 0;
}
.pagination li :any-link, .pagination li.current {
  display: flex;
  justify-content: center;
  align-items: center;
  transition: filter var(--transition);
  background-color: var(--button-bg-color, var(--color-accent));
  padding: 0.5em;
  line-height: 1;
  color: var(--button-link-color, var(--link-color));
  -webkit-user-select: none;
  user-select: none;
  border-radius: 0.5rem;
  font-weight: 600;
  aspect-ratio: 1;
  min-inline-size: 4rem;
  text-align: center;
}
.pagination li :any-link:where(:hover, :focus-visible), .pagination li.current {
  filter: brightness(0.8) contrast(1.6) saturate(0.8);
}

.tt_address_list {
  display: flex;
  flex-direction: column;
  gap: var(--gutter);
}

.tt_address_list .vcard .row {
  --gap: calc(var(--gutter) / 2);
  align-items: center;
}

@media (min-width: 744px) {
  .tt_address_list .vcard .row {
    --gap: calc(var(--gutter) * 2);
  }
}
.tt_address_list .vcard h3 {
  color: var(--color-primary);
  font-weight: bolder;
  font-size: var(--font-size-sm);
}

.tt_address_list .vcard em {
  font-style: normal;
}

#content [data-content] .breadcrumbs {
  --block-margin: var(--block-padding);
  margin-block: calc(var(--block-margin) * -1) var(--block-margin);
}

.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
  padding-inline: 0;
}
.breadcrumbs li {
  list-style: none;
  margin: 0;
}
.breadcrumbs li:not(:last-child)::after {
  content: "/";
  margin-inline-start: 0.25em;
  color: var(--color-accent);
}
.breadcrumbs span {
  color: var(--color-accent);
}

.overlay {
  position: relative;
  z-index: 5;
  width: 100%;
  margin-block: calc((var(--decor-height) - 0.1rem) * -1) var(--gutter);
  block-size: var(--decor-height);
  overflow: hidden;
  backface-visibility: hidden;
}
.overlay.reverse {
  transform: scale(-1, -1);
  margin-block: 0 calc((var(--decor-height) - 0.1rem) * -1);
  block-size: var(--decor-height);
}
@media (min-width: 744px) {
  .overlay {
    margin-block-start: calc((var(--decor-height) - 0.1rem) * -1);
    block-size: var(--decor-height);
  }
}
[data-content]:not([data-overlay=bottom]):not(.frame-custom-section) + [data-overlay=top] .overlay {
  margin-block-start: 0;
}
[data-overlay=bottom] + [data-overlay=top] .overlay {
  display: none;
}
.overlay svg {
  display: block;
  inline-size: 230%;
  transform: translateX(-66%);
  inset-inline-start: 50%;
  position: relative;
  height: auto;
  max-inline-size: none;
}
@media (min-width: 960px) {
  .overlay svg {
    inline-size: 120%;
    transform: translateX(-50%);
  }
}
.overlay .path-1 {
  fill: color-mix(in hsl, var(--color-accent), transparent 20%);
}
.overlay .path-2 {
  fill: var(--color-bg);
}

.news {
  --border-radius: 2.7rem;
}
.news > header {
  margin-block-end: calc(var(--gutter) * 2);
}

.news-list-view {
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--gutter) * 2) var(--gutter);
}

.news-list-item {
  display: block;
  margin: 0;
}
@media (min-width: 744px) {
  .news-list-item {
    text-align: center;
    inline-size: calc(50% - var(--gutter) / 2);
  }
}
.news-list-item .news-img-wrap {
  border-radius: calc(var(--border-radius) / 2);
  margin-block-end: var(--gutter);
  overflow: hidden;
}
.news-list-item .news-img-wrap img {
  max-inline-size: 100%;
}
.news-list-item .news-list-content {
  display: revert;
}
.news-list-item .news-title {
  display: inline-block;
}

.news-preview-list {
  font-size: var(--font-size-md);
  display: grid;
  gap: var(--gutter) calc(var(--gutter) / 2);
}
@media (min-width: 540px) {
  .news-preview-list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 960px) {
  .news-preview-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gutter) calc(var(--gutter) / 2);
  }
}
@media (min-width: 1260px) {
  .news-preview-list {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: calc(var(--gutter) * 1.5) var(--gutter);
  }
}

.news-preview-item {
  border: var(--border-line-thick) var(--color-accent);
  border-radius: var(--border-radius);
  overflow: hidden;
  position: relative;
  min-block-size: 18rem;
}
@media (min-width: 1260px) {
  .news-preview-item {
    min-block-size: 9.8vw;
  }
  .news-preview-item:nth-child(4n+1) {
    grid-column: 1/4;
  }
  .news-preview-item:nth-child(4n+2) {
    grid-column: 4/7;
  }
  .news-preview-item:nth-child(4n+3) {
    grid-column: 2/5;
  }
  .news-preview-item:nth-child(4n+4) {
    grid-column: 5/8;
  }
}
.news-preview-item:hover .news-list-content, .news-preview-item:focus-within .news-list-content {
  opacity: 1;
}
.news-preview-item .news-img-wrap {
  position: absolute;
  inset: 0;
  margin: 0;
  z-index: 1;
}
.news-preview-item .news-img-wrap img {
  object-fit: cover;
  object-position: center;
  block-size: 100%;
}
.news-preview-item .news-list-content {
  display: flex;
  flex-direction: column;
  position: relative;
  gap: 1rem;
  line-height: 1;
  z-index: 1;
  transition: var(--transition);
  text-align: center;
  padding: 2rem 1rem;
  min-block-size: 100%;
}
@media (min-width: 960px) {
  .news-preview-item .news-list-content {
    opacity: 0;
  }
}
.news-preview-item .title-wrap {
  display: flex;
  position: relative;
  font-size: var(--font-size-xl);
  font-weight: 700;
  z-index: 1;
  flex-grow: 1;
  color: var(--color-white);
}
.news-preview-item .news-list-title {
  flex-grow: 1;
  display: grid;
  place-items: center;
  padding-block-start: 2rem;
}
.news-preview-item .news-list-link {
  font-size: var(--font-size-sm);
  font-weight: 400;
  align-self: center;
}
.news-preview-item .news-list-link::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: color-mix(in hsl, var(--color-black), transparent 30%);
  z-index: -1;
}
.news-preview-item .news-list-link:where(:hover, :focus-within, :focus-visible) {
  color: var(--color-accent);
}

.news-list-detail-view {
  --bg-color: var(--data-color-secondary);
  display: flex;
  flex-direction: column;
  gap: calc(var(--gutter) * 2) var(--gutter);
  row-gap: 0;
  position: relative;
  inset-inline-start: 50%;
  transform: translateX(-50%);
  inline-size: 100vw;
}
@media (min-width: 960px) {
  .news-list-detail-view {
    --border-radius: calc(var(--border-radius) / 2);
    inline-size: 100%;
    padding-inline: calc(var(--content-padding) / 8);
  }
}
.news-list-detail-view .news-list-item {
  inline-size: 100%;
  grid-template-areas: "title" "gallery" "description";
  gap: var(--gutter);
}
@media (min-width: 960px) {
  .news-list-detail-view .news-list-item {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto 1fr;
    grid-template-areas: "title description" "gallery description";
  }
}
.news-list-detail-view .news-img-wrap {
  margin: 0;
}
.news-list-detail-view .title-block {
  grid-area: title;
  background-color: var(--bg-color);
  color: var(--header-color);
  padding: calc(var(--gutter) / 2);
  font-size: var(--font-size-lg);
  max-inline-size: 100%;
  inline-size: 100%;
  margin: 0;
  border-block: var(--border-line-thick) var(--border-color);
}
[data-theme=light] .news-list-detail-view .title-block {
  color-scheme: light;
  --bg-color: var(--color-white);
  --header-color: var(--data-color-secondary);
  --border-color: var(--color-accent);
}
@media (prefers-color-scheme: light) {
  .news-list-detail-view .title-block {
    color-scheme: light;
    --bg-color: var(--color-white);
    --header-color: var(--data-color-secondary);
    --border-color: var(--color-accent);
  }
}
[data-theme=dark] .news-list-detail-view .title-block {
  color-scheme: dark;
  --bg-color: var(--data-color-secondary);
  --header-color: var(--color-white);
  --border-color: var(--data-color-secondary);
}
@media (prefers-color-scheme: dark) {
  .news-list-detail-view .title-block {
    color-scheme: dark;
    --bg-color: var(--data-color-secondary);
    --header-color: var(--color-white);
    --border-color: var(--data-color-secondary);
  }
}
@media (min-width: 960px) {
  .news-list-detail-view .title-block {
    text-align: center;
    border-radius: 1rem;
    border-inline: var(--border-line-thick) var(--border-color);
  }
}
@media (min-width: 1260px) {
  .news-list-detail-view .title-block {
    padding: calc(var(--gutter) * 3 / 4) calc(var(--gutter) / 2);
  }
}
.news-list-detail-view .news-img-wrap {
  border-radius: 0;
}
@media (min-width: 960px) {
  .news-list-detail-view .news-img-wrap {
    border-radius: 1rem;
  }
}
.news-list-detail-view .gallery-block {
  grid-area: gallery;
}
.news-list-detail-view .description-block {
  grid-area: description;
  background-color: var(--bg-color);
  padding: calc(var(--gutter) / 2) calc(var(--gutter) / 2) var(--gutter);
  font-size: var(--font-size-md);
  text-align: left;
}
[data-theme=light] .news-list-detail-view .description-block {
  color-scheme: light;
  --bg-color: var(--color-light);
}
@media (prefers-color-scheme: light) {
  .news-list-detail-view .description-block {
    color-scheme: light;
    --bg-color: var(--color-light);
  }
}
[data-theme=dark] .news-list-detail-view .description-block {
  color-scheme: dark;
  --bg-color: var(--data-color-secondary);
}
@media (prefers-color-scheme: dark) {
  .news-list-detail-view .description-block {
    color-scheme: dark;
    --bg-color: var(--data-color-secondary);
  }
}
@media (min-width: 960px) {
  .news-list-detail-view .description-block {
    border-radius: 1rem;
  }
}
@media (min-width: 1260px) {
  .news-list-detail-view .description-block {
    padding: calc(var(--gutter) * 2);
  }
}
.news-list-detail-view .description {
  margin-block-end: calc(var(--gutter) * 1.5);
  font-size: var(--font-size-sm);
}
.news-list-detail-view .price {
  border-radius: 0.5rem;
  background-color: var(--button-bg-color, var(--color-accent));
  padding: 0.6636em 2em;
  font-weight: 600;
  color: var(--button-link-color, var(--link-color));
}
.news-list-detail-view .description-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: calc(var(--gutter) / 2) var(--gutter);
  margin-block-end: var(--gutter);
}
.news-list-detail-view .model-name {
  font-size: var(--font-size-md-alt);
  font-weight: 600;
  color: var(--header-color);
}
[data-theme=light] .news-list-detail-view .model-name {
  color-scheme: light;
  --header-color: var(--color-secondary);
}
@media (prefers-color-scheme: light) {
  .news-list-detail-view .model-name {
    color-scheme: light;
    --header-color: var(--color-secondary);
  }
}
[data-theme=dark] .news-list-detail-view .model-name {
  color-scheme: dark;
  --header-color: inherit;
}
@media (prefers-color-scheme: dark) {
  .news-list-detail-view .model-name {
    color-scheme: dark;
    --header-color: inherit;
  }
}
@media (min-width: 960px) {
  .news-list-detail-view .button-block {
    text-align: center;
  }
}
.news-list-detail-view .button-block .button {
  font-size: var(--font-size-sm);
}
@media (min-width: 960px) {
  .news-list-detail-view .button-block .button {
    font-size: var(--font-size-md);
  }
}
.news-list-detail-view .back-link {
  align-self: flex-start;
}

.reparatur-item:focus-within .reparatur-link,
.reparatur-item:focus-within .heading,
.reparatur-item:focus-within .image-holder::after,
.reparatur-item:hover .reparatur-link,
.reparatur-item:hover .heading,
.reparatur-item:hover .image-holder::after {
  opacity: 1;
}

.reparatur-item {
  --color-text: var(--color-white);
  --border-radius: 2.7rem;
  --header-color: var(--color-white);
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-areas: "image" "content" "link";
  background-color: var(--data-color-secondary);
  padding: var(--gutter-fluid);
  border-radius: var(--border-radius);
  color: var(--color-text);
  min-block-size: 100%;
}
@media (min-width: 960px) {
  .reparatur-item {
    display: block;
    padding: calc(var(--gutter-fluid) / 2);
  }
}
@media (min-width: 1260px) {
  .reparatur-item {
    padding: var(--gutter-fluid);
  }
}
.reparatur-item:focus-within {
  outline: var(--border-dots) var(--color-selection);
}
.reparatur-item::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: color-mix(in hsl, var(--color-accent), transparent 30%);
  border-radius: var(--border-radius);
  z-index: -1;
  transform: translate(-1rem, -1rem);
}
.reparatur-item .top-holder {
  display: contents;
}
@media (min-width: 960px) {
  .reparatur-item .top-holder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    position: relative;
    aspect-ratio: 1/0.69;
    margin-block-end: calc(var(--gutter) / 2);
    text-align: center;
  }
}
.reparatur-item .image-holder {
  padding: 2em;
  display: grid;
  place-items: center;
  grid-area: image;
  position: relative;
  aspect-ratio: 1/0.69;
  margin-block-end: calc(var(--gutter) / 2);
  text-align: center;
  min-width: 0;
  border-radius: var(--border-radius);
  overflow: hidden;
}
@media (min-width: 960px) {
  .reparatur-item .image-holder {
    display: contents;
  }
}
.reparatur-item .image-holder::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--color-black);
  background-color: color-mix(in hsl, var(--color-black), transparent 30%);
  transition: var(--transition);
  border-radius: var(--border-radius);
}
@media (min-width: 960px) {
  .reparatur-item .image-holder::after {
    opacity: 0;
  }
}
.reparatur-item .heading {
  position: relative;
  z-index: 1;
  transition: var(--transition);
}
@media (min-width: 960px) {
  .reparatur-item .heading {
    display: grid;
    place-items: center;
    opacity: 0;
    flex-grow: 1;
    padding-block-start: var(--font-size-sm);
  }
}
.reparatur-item .media {
  position: absolute;
  inset: 0;
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  border-radius: var(--border-radius);
  overflow: hidden;
}
.reparatur-item .media img {
  block-size: 100%;
}
.reparatur-item .reparatur-link {
  position: relative;
  grid-area: link;
  transition: var(--transition);
}
@media (min-width: 960px) {
  .reparatur-item .reparatur-link {
    opacity: 0;
  }
  .reparatur-item .reparatur-link:where(:hover, :focus-visible, :focus-within) {
    opacity: 1;
  }
}
@media (min-width: 960px) {
  .reparatur-item .reparatur-link::after {
    content: "";
    position: absolute;
    inset: 0;
  }
}
.reparatur-item .reparatur-content {
  grid-area: content;
  margin-block-end: calc(var(--gutter) / 2);
}
@media (min-width: 960px) {
  .reparatur-item .reparatur-content {
    text-align: center;
  }
}
.reparatur-item .reparatur-content :where(p, ul) {
  margin-block-end: 0;
}
.reparatur-item :where(h2, h3) {
  font-weight: 600;
  margin: 0;
  font-size: var(--font-size-md);
}
[data-theme=light] .reparatur-item :where(h2, h3) {
  color-scheme: light;
  --header-color: var(--color-white);
}
@media (prefers-color-scheme: light) {
  .reparatur-item :where(h2, h3) {
    color-scheme: light;
    --header-color: var(--color-white);
  }
}
@media (min-width: 1260px) {
  .reparatur-item :where(h2, h3) {
    font-size: var(--font-size-lg);
  }
}
}