@font-face {
  font-family: "Montserrat";
  src: url("/assets/fonts/montserrat-variable.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
:root { --forest: #213f41; --solar: #ffff8e; }
* { box-sizing: border-box; }
body { margin: 0; background: #fff; color: var(--forest); font-family: "Montserrat", sans-serif; }

.hero { position: relative; aspect-ratio: 1166 / 755; max-height: 100vh; width: 100%; overflow: hidden; background: var(--forest); }
/* Entwurf zeigt das Bild gespiegelt und abgedunkelt */
.hero::before { content: ""; position: absolute; inset: 0; background: url("/assets/images/hero.webp") center / cover; transform: scaleX(-1); }
.hero::after { content: ""; position: absolute; inset: 0; background: rgba(33, 63, 65, .45); }
.logo { position: absolute; z-index: 1; left: 50%; top: 36%; width: 36.8%; aspect-ratio: 597 / 286; transform: translateX(-50%); background: var(--solar); -webkit-mask: url("/assets/images/logo-freiwald.png") center / contain no-repeat; mask: url("/assets/images/logo-freiwald.png") center / contain no-repeat; }

main { padding: 4.2vw 4.2vw 10vw; }
h1 { margin: 0 0 4.6vw; font-size: 6.9vw; line-height: 1; font-weight: 500; text-transform: uppercase; }
.lead, address, hr { margin-left: 13.1vw; max-width: 65.7vw; }
.lead { font-size: 1.585vw; line-height: 1.35; margin-top: 0; margin-bottom: 2.7vw; padding-bottom: 3.9vw; border-bottom: 1px solid #000; }
address { display: grid; grid-template-columns: 19.8vw auto; font-style: normal; font-size: 1.03vw; line-height: 1.6; font-weight: 500; text-transform: uppercase; letter-spacing: .02em; }
address p { margin: 0; }
address a { color: inherit; text-decoration: none; }
address a:hover { text-decoration: underline; }

@media (max-width: 800px) {
  main { padding: 8vw 6vw 14vw; }
  h1 { font-size: 17vw; margin-bottom: 8vw; }
  .lead, address { margin-left: 0; max-width: none; }
  .lead { font-size: 4.4vw; padding-bottom: 6vw; margin-bottom: 6vw; }
  address { grid-template-columns: 1fr; gap: 4vw; font-size: 3.4vw; }
  .logo { width: 56%; }
}