:root{--wolle:#F3EDE4;--tinte:#2F2A26;--rose:#E06C8A;--rosehell:#F2A6B8;--rosetief:#B23A5E;--moos:#6F7559;--hafer:#E2D3BE;--linie:#DCCFBF;--weiss:#FFFDFB;
--f-d:"Fraunces",Georgia,serif;--f-b:"Jost",system-ui,sans-serif}
*{box-sizing:border-box}
html{background:var(--wolle);color-scheme:light}
body{margin:0;min-height:100vh;background:var(--wolle);color:var(--tinte);font:17px/1.65 var(--f-b);display:flex;flex-direction:column;
 padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
a{color:var(--rosetief)}
main{flex:1;width:100%;max-width:760px;margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center;padding-block:clamp(40px,9vh,96px) 40px}
.logo{width:min(520px,88vw);height:auto}
.logo-v{display:none}
@media (max-width:520px){.logo-h{display:none}.logo-v{display:block;width:min(260px,62vw)}}
h1{font-family:var(--f-d);font-weight:420;font-variation-settings:"SOFT" 100,"opsz" 96;font-size:clamp(30px,5.4vw,46px);line-height:1.12;margin:clamp(28px,5vh,48px) 0 12px;text-wrap:balance}
.lead{max-width:34em;margin:0 0 26px;color:#5A524B}
.slogans{list-style:none;padding:0;margin:0 0 34px;display:grid;gap:6px;font-family:var(--f-d);font-size:clamp(17px,2.4vw,20px);font-variation-settings:"SOFT" 100}
.slogans li span{font-family:var(--f-b);font-size:11px;letter-spacing:.18em;color:var(--moos);margin-right:10px;vertical-align:2px}
.box{width:100%;max-width:460px;background:var(--weiss);border:1px solid var(--linie);border-radius:18px;padding:22px 22px 18px;text-align:left}
.box h2{font-family:var(--f-d);font-weight:450;font-size:21px;margin:0 0 4px}
.box p.s{margin:0 0 14px;font-size:15px;color:#6E655E}
.row{display:flex;gap:8px;flex-wrap:wrap}
.row input[type=email]{flex:1;min-width:200px;font:inherit;padding:12px 14px;border:1px solid var(--linie);border-radius:999px;background:#fff;color:var(--tinte)}
.row input[type=email]:focus-visible,button:focus-visible,a:focus-visible,.check input:focus-visible{outline:2px solid var(--rosetief);outline-offset:2px}
button{font:500 16px var(--f-b);padding:12px 22px;border-radius:999px;border:0;background:var(--tinte);color:var(--wolle);cursor:pointer}
button:hover{background:#463F39}
.check{display:flex;gap:10px;align-items:flex-start;margin-top:12px;font-size:13.5px;color:#5A524B;line-height:1.5}
.check input{margin-top:3px;accent-color:var(--rosetief)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.msg{margin:12px 0 0;font-size:15px;min-height:1.5em}
.msg.ok{color:var(--moos)}.msg.err{color:var(--rosetief)}
footer{width:100%;max-width:760px;margin:0 auto;padding:22px 0 calc(22px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--linie);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:#6E655E}
footer nav{display:flex;gap:16px}footer a{color:inherit}
.legal{text-align:left;align-items:stretch}
.legal h1{margin-top:28px}.legal h2{font-family:var(--f-d);font-weight:450;font-size:21px;margin:28px 0 6px}
.legal p,.legal li{font-size:16px}.legal .back{align-self:flex-start;font-size:14px}
.legal .logo-mini{width:150px;height:auto;align-self:flex-start}
/* Web-Intro: S erscheint, Blüte öffnet sich Blatt für Blatt, Schrift folgt */
@media (prefers-reduced-motion:no-preference){
 .logo .sprig .bl>g .pet{transform-box:fill-box;transform-origin:50% 100%;animation:pop .55s cubic-bezier(.3,1.5,.5,1) both}
 .logo .sprig .bl>g:nth-of-type(1) .pet{animation-delay:.35s}.logo .sprig .bl>g:nth-of-type(2) .pet{animation-delay:.45s}
 .logo .sprig .bl>g:nth-of-type(3) .pet{animation-delay:.55s}.logo .sprig .bl>g:nth-of-type(4) .pet{animation-delay:.65s}
 .logo .sprig .bl>g:nth-of-type(5) .pet{animation-delay:.75s}
 .logo .kn{transform-box:fill-box;transform-origin:center;animation:pop .5s .25s cubic-bezier(.3,1.5,.5,1) both}
 .logo .ema,.logo .atel{animation:fade .8s .7s ease both}
 .logo>path:first-of-type{animation:fade .6s ease both}
 .logo .sprig{transform-box:fill-box;transform-origin:30% 90%;animation:sway 6s 2s ease-in-out infinite alternate}
}
@keyframes pop{from{transform:scale(0)}to{transform:scale(1)}}
@keyframes fade{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
@keyframes sway{from{transform:rotate(-2.5deg)}to{transform:rotate(2.5deg)}}
