@font-face{font-family:"Picnic Club";src:url(/assets/fonts/picnic.woff2) format("woff2");font-weight:100;font-style:normal;font-display:swap}
@font-face{font-family:"Picnic Club Fallback";src:local("Times New Roman"),local("Times");size-adjust:79.1%;ascent-override:119%;descent-override:33%;line-gap-override:0%}
@font-face{font-family:"PolySans Slim";src:url(/assets/fonts/slim.woff2) format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"PolySans Slim Fallback";src:local("Arial"),local("Helvetica");size-adjust:98.7%;ascent-override:81%;descent-override:21.3%;line-gap-override:0%}
@font-face{font-family:"PolySans Neutral";src:url(/assets/fonts/neutral.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"PolySans Neutral Fallback";src:local("Arial"),local("Helvetica");size-adjust:101.6%;ascent-override:78.7%;descent-override:20.7%;line-gap-override:0%}

/* Tokens 1:1 von 97.de */
:root{--dur-1:.16s;--dur-2:.26s;--dur-3:.42s;--ease-out:cubic-bezier(.22,.61,.36,1);--ease-spring:cubic-bezier(.34,1.56,.64,1);
  --ruhe:#edede2;--tiefe:#2b100d;--puls:#f25c4c;--licht:#fefefd;--container:1360px;--pad:clamp(20px,2.5vw,120px);--round:min(75px,3.5vmin);
  --txt:clamp(1.125rem,1.125vw,2.75rem);--lead:clamp(1.375rem,1.375vw,3.3rem);--header-h:calc(var(--pad)*2 + clamp(34px,3vw,116px));--surface:#edede2;
  --slim:"PolySans Slim","PolySans Slim Fallback",system-ui,-apple-system,sans-serif;--neutral:"PolySans Neutral","PolySans Neutral Fallback",system-ui,sans-serif;--display:"Picnic Club","Picnic Club Fallback",Georgia,serif}
@media (width<=760px){:root{--pad:clamp(20px,5vw,64px);--txt:1.375rem;--lead:1.5rem;--round:24px;--header-h:calc(48px + 48px)}}
*,*:before,*:after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;color:var(--tiefe);background:var(--ruhe);font-family:var(--slim);font-weight:300;line-height:1.55;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}
a{color:inherit;text-decoration:none}
.skip{position:absolute;left:-999px}
.skip:focus{left:var(--pad);top:8px;background:var(--licht);padding:.5em 1em;z-index:99}

/* Kopfzeile wie 97.de: fixiert, Verlauf aus der Flächenfarbe */
header{z-index:60;position:fixed;top:0;left:0;right:0;pointer-events:none}
header:before{content:"";background:linear-gradient(to bottom,var(--surface) 0%,var(--surface) 58%,transparent 100%);z-index:-1;pointer-events:none;height:110px;position:absolute;top:0;left:0;right:0}
.header-inner{padding:var(--pad);justify-content:space-between;align-items:center;display:flex}
.logo{color:inherit;cursor:pointer;display:block;pointer-events:auto}
.logo svg{width:auto;height:clamp(34px,3vw,116px);display:block}
.kicker{font-family:var(--slim);font-size:var(--txt);font-weight:300;letter-spacing:normal;pointer-events:auto}
@media (width<=760px){.header-inner{padding:18px var(--pad);align-items:flex-start}.logo svg{height:48px}.kicker{display:none}}

/* Sektionen */
.sec{width:100%}
.sec-inner{max-width:var(--container);padding:clamp(4.5rem,10vh,18rem) var(--pad);grid-template-columns:repeat(12,1fr);gap:clamp(2.5rem,5vh,9rem) .94vw;margin:0 auto;display:grid}
main>.sec:first-child>.sec-inner{padding-top:calc(var(--header-h) + clamp(1rem,3vh,3rem))}
.statement{letter-spacing:-.02em;grid-column:1/-1;margin:0;font-family:var(--display);font-size:clamp(3.25rem,4.53vw,11rem);font-weight:100;line-height:1}
.prose{font-size:var(--txt);grid-column:3/span 10;max-width:72ch}
.prose--breit{grid-column:1/-1;max-width:none}
.prose p{margin:0 0 .85em}
.prose .lead{letter-spacing:-.01em;margin:0 0 1em;font-family:var(--neutral);font-size:var(--lead);font-weight:400;line-height:1.35}
.prose p a,.kbox-text a,.k-contact span{text-decoration-skip-ink:auto;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em;transition:text-decoration-color .26s}
.prose p a:hover,.kbox-text a:hover,.k-contact:hover span,.prose p a:focus-visible,.k-contact:focus-visible span{text-decoration-color:var(--puls);text-decoration-thickness:.14em}
.zs{display:none}@media (width>=761px){.zs{display:inline}}

/* Kästen wie auf der Kontaktseite */
.kontakt-stapel{grid-column:1/-1;gap:clamp(1rem,1.6vw,2rem);display:grid}
.kbox{background:var(--licht);border-radius:var(--round);padding:clamp(1.8rem,2.6vw,3.6rem)}
.kbox-anfrage{flex-direction:column;align-items:flex-start;gap:.9em;display:flex}
.tags{display:flex;flex-wrap:wrap;gap:.5em;align-items:center}
.kbox-tag{opacity:.55;border:1px dashed;border-radius:999px;padding:.45em .8em;font-size:.85rem;line-height:1;display:inline-block}
.kbox-titel{letter-spacing:-.01em;margin:0;font-family:var(--neutral);font-size:var(--lead);font-weight:400;line-height:1.3}
.kbox-text{font-size:var(--txt);line-height:1.45;margin:0}
.k-caption{font-family:var(--slim);font-weight:300;font-size:var(--txt);line-height:1.28;margin:0}
.k-contact{letter-spacing:-.01em;align-items:center;gap:.5em;font-family:var(--neutral);font-size:var(--lead);font-weight:400;display:inline-flex}
.k-contact svg{flex:none;width:.95em;height:.95em;display:block}

/* Formular: Unterstrich-Feld und Text-Button mit Pfeil, wie Anfrage und CTA auf 97.de */
.anfrage{font-size:var(--txt);flex-direction:column;gap:1.2em;line-height:1.45;display:flex;width:100%}
.anf-frage{letter-spacing:-.01em;margin:0;font-family:var(--neutral);font-size:var(--lead);font-weight:400;line-height:1.3}
.anf-felder{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.3em 1.8em;align-items:end;width:100%}
.feld{flex-direction:column;gap:.15em;display:flex;min-width:0}
.feld label{font-size:.85rem;opacity:.55;line-height:1}
.feld input{font:inherit;font-family:var(--neutral);font-weight:400;font-size:var(--lead);color:inherit;border:0;border-bottom:1px solid var(--tiefe);background:0 0;border-radius:0;outline:none;padding:.35em 0;transition:border-color .22s;width:100%;min-width:0}
.feld input::placeholder{color:var(--tiefe);opacity:.45}
.feld input:focus{border-bottom-color:var(--puls)}
.anf-weiter{font:inherit;font-family:var(--neutral);font-weight:400;font-size:var(--lead);color:inherit;cursor:pointer;background:0 0;border:0;padding:.35em 0;margin:0;display:inline-flex;align-items:center;white-space:nowrap}
.anf-weiter:focus-visible{outline:2px solid var(--puls);outline-offset:4px;border-radius:4px}
.pfeil{vertical-align:middle;width:84px;height:22px;margin-left:.6rem;display:inline-block;position:relative}
.pfeil svg{height:22px;display:block;position:absolute;top:0;overflow:visible;transition:transform .26s var(--ease-out)}
.pf-schaft{transform-origin:0;width:80px;left:0}
.pf-spitze{width:14px;left:70px}
.anf-weiter:hover .pf-spitze{transform:translateX(5px)}
.anf-weiter:hover .pf-schaft{transform:scaleX(1.06)}
.anf-hinweis{min-height:1.5em;margin:0;font-size:.85rem;opacity:.55}
@media (width<=760px){.anf-felder{grid-template-columns:1fr}}

/* Ergebnis */
.ergebnis{display:none}
.ergebnis.show{display:flex;animation:anfRein .38s var(--ease-out) both}
@keyframes anfRein{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.ergebnis.show{animation:none}}
.kbox-tag.ok{opacity:1;border-style:solid;color:#2f7d4f;border-color:#2f7d4f}
.kbox-tag.warn{opacity:1;border-style:solid;color:#9a6a00;border-color:#9a6a00}
.kbox-tag.neutral{opacity:.7}
.kbox-tag.pend{opacity:1;border-style:dashed;color:var(--tiefe)}
.kbox-tag.unknown{opacity:1;border-style:solid;color:var(--puls);border-color:var(--puls)}
.ergebnis .kbox-text{max-width:62ch}
.fakten{display:grid;grid-template-columns:repeat(auto-fit,minmax(13em,1fr));gap:1.1em 1.8em;margin:.6em 0 0;padding:1.4em 0 0;border-top:1px solid color-mix(in oklab,var(--tiefe) 16%,transparent);width:100%}
.fakten div{display:flex;flex-direction:column;gap:.15em}
.fakten dt{font-size:.85rem;opacity:.55;line-height:1.2}
.fakten dd{margin:0;font-family:var(--neutral);font-weight:400;font-size:var(--txt);line-height:1.3;overflow-wrap:anywhere}
.fakten dd.ok{color:#2f7d4f}

/* Fußzeile wie 97.de */
.site-footer{width:100%}
.footer-inner{max-width:var(--container);padding:clamp(3rem,5vh,9rem) var(--pad) clamp(2.5rem,3.89vh,7rem);font-family:var(--slim);font-weight:300;font-size:var(--txt);letter-spacing:normal;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:1.25rem 2rem;margin:0 auto;display:flex}
.footer-meta{flex-wrap:wrap;gap:1.5rem;display:inline-flex}
.footer-meta a{padding:.35em 0;display:inline-block;transition:color .26s}
.footer-meta a:hover,.footer-meta a:focus-visible{color:var(--puls)}
@media (width<=760px){.sec-inner{padding:clamp(3.5rem,10vh,6rem) var(--pad);grid-template-columns:1fr;row-gap:clamp(2.5rem,6vh,4.5rem)}.statement,.prose{grid-column:1/-1}.footer-inner{padding:clamp(3rem,6vh,4.5rem) var(--pad) clamp(2.5rem,5vh,3.5rem);flex-direction:column;align-items:flex-start}}
@media (width>=1100px){.hero-spalte{grid-column:4/span 9}}