.hero footer{display:flex;justify-content:space-between;align-items:center;font-size:.8rem;color:var(--stone)}
nav{display:flex;flex-wrap:wrap;gap:8px clamp(14px,2vw,28px)}
nav a,.contact a{color:var(--ink);text-decoration:none;font-weight:300;position:relative}
nav a::after,.contact a::after{content:"";position:absolute;left:0;right:100%;bottom:-3px;height:1px;background:currentColor;transition:right .35s}
nav a:hover::after,.contact a:hover::after{right:0}
.down{position:absolute;left:50%;transform:translateX(-50%);animation:bob 2.4s ease-in-out infinite;color:var(--ink)}
@keyframes bob{50%{transform:translate(-50%,6px)}}
/* ---------- Rechtstexte ---------- */
  .legal{display:block;text-align:left;max-width:760px;margin:0 auto;padding:clamp(48px,7vw,110px) clamp(18px,4vw,56px) clamp(64px,8vw,120px)}
.legal h1{font-weight:300;letter-spacing:-.035em;line-height:.98;font-size:clamp(2.6rem,7vw,6.5rem)}
.legal h1 em{font-family:var(--serif);font-style:normal;font-weight:400}
.legal .stand{margin-top:14px;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--stone)}
.legal h2{margin-top:clamp(40px,5vw,64px);font-weight:400;font-size:1.35rem;letter-spacing:-.02em;padding-top:22px;border-top:1px solid var(--line)}
.legal h3{margin-top:26px;font-weight:400;font-size:1rem}
.legal p,.legal li{font-size:1rem;line-height:1.65;color:var(--grey);margin-top:12px}
.legal ul{padding-left:1.2em;margin-top:8px}
.legal li{margin-top:6px}
.legal a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line)}
.legal a:hover{border-color:#FF2D6A}
.legal address{font-style:normal;line-height:1.65;color:var(--ink);margin-top:12px}
.legal .box{margin-top:16px;padding:18px 20px;border:1px solid var(--line);border-radius:14px}
.page>footer{display:flex;justify-content:space-between;align-items:center;font-size:.8rem;color:var(--stone);padding:0 clamp(18px,4vw,56px)}
.page>footer nav{display:flex;flex-wrap:wrap;gap:8px clamp(14px,2vw,28px)}
/* ---------- Kontakt ---------- */
  .contact{position:relative;z-index:1;background:#fff;min-height:calc(100dvh - 80px);
    padding:clamp(64px,9vw,140px) clamp(18px,4vw,56px) clamp(32px,4vw,56px);
    display:grid;grid-template-rows:auto auto;}
.contact .grid{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(32px,6vw,96px);align-items:start}
.contact h2{font-weight:300;letter-spacing:-.035em;line-height:.98;font-size:clamp(2.6rem,7vw,7.5rem)}
.contact h2 em{font-family:var(--serif);font-style:normal;font-weight:400}
.contact .intro{margin-top:clamp(18px,2vw,28px);max-width:44ch;font-size:clamp(.95rem,1.2vw,1.15rem);line-height:1.55;color:var(--grey)}
.mail{display:inline-block;margin-top:clamp(28px,4vw,56px);font-size:clamp(1.3rem,3vw,2.8rem);letter-spacing:-.025em;color:var(--ink);text-decoration:none;
    background:linear-gradient(90deg,#F400D8,#FF2D6A,#FF6A00,#2B6BFF);background-size:0% 2px;background-repeat:no-repeat;background-position:0 100%;
    transition:background-size .5s cubic-bezier(.2,.7,.2,1);padding-bottom:6px}
.mail:hover{background-size:100% 2px}
dl{display:grid;grid-template-columns:auto 1fr;gap:14px clamp(20px,3vw,40px);font-size:.95rem;line-height:1.5;padding-top:.6em}
dt{color:var(--stone);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;padding-top:.35em}
dd a{color:var(--ink);text-decoration:none}
dd a:hover{color:#FF2D6A}
dd + dt{border-top:1px solid var(--line);padding-top:14px}
dd + dt + dd{border-top:1px solid var(--line);padding-top:14px}
form{margin-top:clamp(28px,3vw,48px);display:grid;gap:0}
form input,form textarea{width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;font:inherit;font-size:1rem;color:var(--ink);padding:16px 0;outline:none;resize:none;transition:border-color .3s;border-radius:0}
form input:focus,form textarea:focus{border-color:var(--ink)}
form input::placeholder,form textarea::placeholder{color:var(--stone)}
form button{margin-top:28px;justify-self:start;font:inherit;font-size:.9rem;font-weight:400;color:#fff;background:var(--ink);border:0;border-radius:999px;padding:14px 26px;cursor:pointer;display:flex;align-items:center;gap:10px;transition:transform .3s,background .3s}
form button:hover{transform:translateY(-2px);background:#FF2D6A}
.contact footer{display:flex;justify-content:space-between;align-items:center;font-size:.8rem;color:var(--stone);padding-top:clamp(64px,8vw,120px)}
.page>header{padding:clamp(18px,3vw,36px) clamp(18px,4vw,56px) 0}
@media (max-width:820px){
    .contact .grid{grid-template-columns:1fr}
    h1{white-space:normal}
  }
@media (max-width:640px){
    #glow{filter:blur(34px) saturate(1.4)}
    .hero footer,.contact footer{flex-direction:column;gap:10px;align-items:flex-start}
    .down{display:none}
  }
@media (prefers-reduced-motion:reduce){h1,.lead{animation-duration:.01s}.down{animation:none}}
/* lange URLs im Rechtstext duerfen auf schmalen Handys umbrechen */
  p a{overflow-wrap:anywhere}
.legal h1{hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word}
/* Header bleibt beim Scrollen oben, alles laeuft darunter durch (2026-09-14) */
  .page>header{position:sticky;top:0;z-index:100;padding-top:14px;padding-bottom:14px;transition:background .3s,box-shadow .3s}
html.scrolled .page>header{background:rgba(255,255,255,.84);-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 1px 0 var(--line)}