.home-intro[hidden]{display:none!important}
html.home-intro-pending,html.home-intro-open,body.home-intro-open{overflow:hidden}
.home-intro{
  --intro-accent:#a29062;
  --intro-panel-bg:rgba(255,255,255,.90);
  --intro-panel-text:#1d1d1d;
  --intro-panel-muted:#454545;
  --intro-panel-border:rgba(255,255,255,.78);
  --intro-panel-filter:blur(10px) saturate(1.08);
  --intro-button-bg:#6b5520;
  --intro-button-text:#fff;
  --intro-focus:#2f240d;
  position:fixed;
  inset:0;
  z-index:20000;
  display:grid;
  align-items:center;
  justify-items:end;
  min-height:100vh;
  min-height:100dvh;
  padding:clamp(1rem,3vw,2.5rem);
  overflow-x:hidden;
  overflow-y:auto;
  background:#171717;
  color:var(--intro-panel-text);
  isolation:isolate;
}
.home-intro__image{
  position:fixed;
  inset:0;
  z-index:-2;
  background-color:#111;
  background-image:url("../images/Firmenbild-desktop.webp");
  background-position:center center;
  background-size:cover;
  background-repeat:no-repeat;
  filter:brightness(.82) contrast(1.03) saturate(1.02);
}
.home-intro__image::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.38),rgba(0,0,0,.10) 48%,rgba(0,0,0,.46)),linear-gradient(180deg,rgba(162,144,98,.17),rgba(0,0,0,.18));
  pointer-events:none;
}
.home-intro__panel{
  width:min(42rem,100%);
  min-width:0;
  margin-right:clamp(0rem,5vw,6rem);
  padding:clamp(1.35rem,3vw,2.25rem);
  border:1px solid var(--intro-panel-border);
  border-top:4px solid var(--intro-accent);
  border-radius:22px;
  background:var(--intro-panel-bg);
  color:var(--intro-panel-text);
  -webkit-backdrop-filter:var(--intro-panel-filter);
  backdrop-filter:var(--intro-panel-filter);
  box-shadow:0 .9rem 2.6rem rgba(0,0,0,.28);
  overflow-wrap:anywhere;
  animation:homeIntroPanelIn 220ms ease-out both;
}
.home-intro__brand{
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  max-width:100%;
  margin:0 0 1rem;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible;
  isolation:isolate;
}
.home-intro__brand picture{display:block;line-height:0;background:transparent!important}
.home-intro__logo{
  display:block;
  width:clamp(7.5rem,16vw,10rem);
  max-width:100%;
  height:auto;
  margin:0;
  border:0;
  border-radius:0;
  background:transparent!important;
  filter:none!important;
  mix-blend-mode:normal;
  opacity:1!important;
}
.home-intro h1{max-width:15ch;margin:0 0 1rem;color:var(--intro-panel-text);font-size:clamp(2rem,5vw,3.75rem);font-weight:780;line-height:1.08;letter-spacing:-.04em;overflow-wrap:anywhere;hyphens:auto}
.home-intro__description{display:grid;gap:.75rem;max-width:62ch}
.home-intro__description p{margin:0;color:var(--intro-panel-muted);font-size:clamp(1rem,1.2vw,1.1rem);line-height:1.65;overflow-wrap:anywhere;hyphens:auto}
.home-intro__actions{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;margin-top:1.35rem}
.home-intro__button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;max-width:100%;padding:.78rem 1.25rem;border:2px solid var(--intro-button-bg);border-radius:999px;background:var(--intro-button-bg);color:var(--intro-button-text);font:inherit;font-weight:850;line-height:1.2;cursor:pointer}
.home-intro__button:hover{border-color:#111;background:#111;color:#fff}
.home-intro__button:focus-visible{outline:3px solid var(--intro-focus);outline-offset:4px}
.home-intro.is-closing{opacity:0;visibility:hidden;pointer-events:none;transition:opacity 200ms ease,visibility 200ms ease}
@keyframes homeIntroPanelIn{from{opacity:0;transform:translateY(.6rem)}to{opacity:1;transform:none}}
html.night-mode .home-intro,body.night-mode .home-intro{
  --intro-accent:#c9b288;
  --intro-panel-bg:rgba(19,19,19,.90);
  --intro-panel-text:#f5f5f5;
  --intro-panel-muted:#dedede;
  --intro-panel-border:rgba(201,178,136,.65);
  --intro-button-bg:#dbc79b;
  --intro-button-text:#121212;
  --intro-focus:#fff;
}
html.night-mode .home-intro__image,body.night-mode .home-intro__image{filter:brightness(.55) contrast(1.08) saturate(.9)}
html.night-mode .home-intro__image::before,body.night-mode .home-intro__image::before{background:linear-gradient(90deg,rgba(0,0,0,.60),rgba(0,0,0,.28) 48%,rgba(0,0,0,.72)),linear-gradient(180deg,rgba(201,178,136,.08),rgba(0,0,0,.34))}
html.night-mode .home-intro__button:hover,body.night-mode .home-intro__button:hover{border-color:#fff;background:#fff;color:#121212}
.home-intro__brand .home-intro__logo-picture--light{display:block}
.home-intro__brand .home-intro__logo-picture--dark{display:none!important}
html.night-mode .home-intro__brand .home-intro__logo-picture--light,
body.night-mode .home-intro__brand .home-intro__logo-picture--light{display:none!important}
html.night-mode .home-intro__brand .home-intro__logo-picture--dark,
body.night-mode .home-intro__brand .home-intro__logo-picture--dark{display:block!important}
html.night-mode .home-intro__brand,body.night-mode .home-intro__brand{background:transparent!important;border:0;box-shadow:none!important}
html.night-mode .home-intro__logo,body.night-mode .home-intro__logo{background:transparent!important;filter:none!important;mix-blend-mode:normal}
@media (max-width:768px){
  .home-intro{align-items:end;justify-items:stretch;padding:1rem}
  .home-intro__image{background-image:url("../images/Firmenbild-mobile.webp");background-position:40% center}
  .home-intro__panel{width:100%;margin:0 0 calc(.25rem + env(safe-area-inset-bottom,0px));padding:1.2rem;border-radius:18px}
  .home-intro__logo{width:7.5rem}
  .home-intro h1{max-width:100%;font-size:clamp(1.85rem,9vw,3rem)}
  .home-intro__button{width:100%}
}
@media (max-height:620px) and (orientation:landscape){.home-intro{align-items:start}.home-intro__panel{margin-block:0}}
@media (forced-colors:active){
  .home-intro__image{display:none}
  .home-intro__panel{border:2px solid CanvasText;background:Canvas;color:CanvasText;-webkit-backdrop-filter:none;backdrop-filter:none}
  .home-intro__brand{background:transparent!important;border:0}
  .home-intro__logo{background:#fff!important;filter:none!important;mix-blend-mode:normal;forced-color-adjust:none}
  .home-intro__button{border:2px solid ButtonText}
}
@media (prefers-reduced-motion:reduce){.home-intro,.home-intro *,.home-intro *::before,.home-intro *::after{animation:none!important;scroll-behavior:auto!important;transition:none!important}}
