@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/instrument-serif-400.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300 500;
  font-display: swap;
  src: url(/assets/fonts/inter-var.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root{
    --ink:#14141C; --grey:#5B5B66; --stone:#9A9AA3; --line:rgba(20,20,28,.12);
    --sans:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
    --serif:'Instrument Serif',Georgia,'Times New Roman',serif;
  }
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);font-weight:300;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased}
canvas{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
#glow{filter:blur(48px) saturate(1.4)}
#edge{filter:blur(1.5px) saturate(1.25);mix-blend-mode:multiply}
/* Ausklapp-Menue rechts oben */
  .menu{position:relative;z-index:20}
.menu-btn{display:flex;align-items:center;gap:12px;background:none;border:0;padding:8px 0;cursor:pointer;font:inherit;color:var(--ink)}
.menu-label{font-size:.95rem;font-weight:400;letter-spacing:-.01em}
.burger{display:flex;flex-direction:column;gap:4px;width:22px}
.burger i{display:block;height:2px;background:var(--ink);border-radius:2px;transition:transform .35s cubic-bezier(.2,.7,.2,1),opacity .25s,width .35s}
.burger i:nth-child(2){width:70%;align-self:flex-end}
.menu:hover .burger i:nth-child(2),.menu.open .burger i:nth-child(2){width:100%}
.menu.open .burger i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu.open .burger i:nth-child(2){opacity:0}
.menu.open .burger i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.menu-panel{position:absolute;top:calc(100% + 10px);right:0;display:flex;flex-direction:column;min-width:240px;padding:10px;
    background:rgba(255,255,255,.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--line);border-radius:16px;
    box-shadow:0 30px 60px -24px rgba(20,20,28,.35);transform-origin:top right;transform:translateX(12px) scale(.96);opacity:0;visibility:hidden;
    transition:transform .35s cubic-bezier(.2,.7,.2,1),opacity .3s,visibility 0s .3s}
.menu:hover .menu-panel,.menu.open .menu-panel,.menu:focus-within .menu-panel{transform:none;opacity:1;visibility:visible;transition-delay:0s}
.menu-panel a{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 14px;border-radius:10px;color:var(--ink);text-decoration:none;font-size:1rem;font-weight:400;letter-spacing:-.01em;transition:background .25s,transform .25s}
.menu-panel a:hover{background:rgba(20,20,28,.06);transform:translateX(-3px)}
.menu-panel a.locked{margin-top:6px;border-top:1px solid var(--line);border-radius:0 0 10px 10px;padding-top:14px;color:var(--grey)}
.menu-panel a.locked svg{flex:none}
/* ---------- Hero ---------- */
  .hero{position:relative;z-index:1;min-height:100dvh;display:grid;grid-template-rows:auto 1fr auto;
    padding:clamp(18px,3vw,36px) clamp(18px,4vw,56px)}
header{display:flex;justify-content:space-between;align-items:center}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.brand img{height:30px;width:30px;display:block}
.brand span{font-size:.9rem;font-weight:400;letter-spacing:-.01em}
main{display:grid;place-content:center;text-align:center;padding:40px 0}
h1{font-weight:300;line-height:1;letter-spacing:-.035em;font-size:clamp(3rem,9.5vw,11rem);white-space:nowrap;
    opacity:0;transform:translateY(20px);animation:in 1.4s cubic-bezier(.2,.7,.2,1) .2s forwards}
h1 em{font-family:var(--serif);font-style:normal;font-weight:400;letter-spacing:-.02em}
.lead{max-width:46ch;margin:clamp(20px,2.6vw,36px) auto 0;font-size:clamp(1rem,1.35vw,1.3rem);font-weight:400;line-height:1.55;color:var(--ink);text-shadow:0 0 18px rgba(255,255,255,.9),0 0 36px rgba(255,255,255,.7);
    opacity:0;animation:in 1.4s cubic-bezier(.2,.7,.2,1) .6s forwards}
@keyframes in{to{opacity:1;transform:none}}