/* Magisches Labor — baza wspólna (reset, kontener, lightbox, formularz). Wygląd: <wariant>/styl.css */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;overflow-x:hidden}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
ul{padding:0;list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
.ik{width:1.25em;height:1.25em;flex:none}
.ik-gross{width:2.2em;height:2.2em}
.breite{width:min(1180px,100% - 40px);margin-inline:auto}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;padding:10px 16px;background:#fff;color:#000;border-radius:8px}
.skip:focus{left:8px}
:focus-visible{outline:3px solid currentColor;outline-offset:3px}
.text{max-width:780px}
.text h2{margin:1.6em 0 .5em}
.text p{margin:0 0 1em}
.text a{overflow-wrap:anywhere}
.klein{font-size:.88em}
.f-klein a,.kontakt-karten span{overflow-wrap:anywhere}

/* Formularz */
.formular{display:grid;gap:16px}
.f-reihe{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.formular label{display:grid;gap:6px;font-weight:600;font-size:.95em}
.formular input,.formular select,.formular textarea{width:100%;min-height:48px;padding:11px 14px;border-radius:10px;border:2px solid currentColor;background:transparent;font-weight:400}
.formular textarea{resize:vertical;min-height:130px}
.formular b{color:inherit}
.f-klein{font-size:.85em;line-height:1.5;font-weight:400}
.f-knopf{justify-self:start;display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 26px;border:0;cursor:pointer}
.f-hinweis{padding:14px 16px;border-radius:10px;border:2px dashed currentColor;font-size:.95em}
@media (max-width:640px){.f-reihe{grid-template-columns:1fr}.f-knopf{justify-self:stretch;justify-content:center}}

/* Lightbox */
.lb{position:fixed;inset:0;z-index:2147483100;background:rgba(10,8,18,.92);display:flex;align-items:center;justify-content:center;padding:56px 12px 70px}
.lb[hidden]{display:none}
.lb figure{max-width:min(1100px,100%);max-height:100%;display:flex;flex-direction:column;align-items:center;gap:10px}
.lb img{max-height:calc(100vh - 150px);width:auto;max-width:100%;border-radius:8px}
.lb figcaption{color:#eee;font:15px/1.4 system-ui,sans-serif;text-align:center;max-width:60ch}
.lb button{position:absolute;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:rgba(0,0,0,.4);color:#fff;font:28px/1 system-ui,sans-serif;cursor:pointer}
.lb-zu{top:10px;right:10px}.lb-l{left:10px;top:50%}.lb-r{right:10px;top:50%}
body.lb-auf{overflow:hidden}

/* Odsłanianie (warianty mogą nadpisać) */
.js [data-r]{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.js [data-r].widac{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.js [data-r]{opacity:1;transform:none}}
.lb[hidden] img{display:none}
main,.fuss,.kopf{overflow-x:clip}
h1,h2,h3{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word}
.f-honig{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
/* 22.10: Slime nr 1 + atrakcje (układ wspólny; kolory w wyglądach) */
.slime-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(24px,5vw,64px);align-items:center}
.slime-ober{text-transform:uppercase;letter-spacing:.12em;font-weight:800;font-size:.85em;margin-bottom:6px}
.slime-text .gross{margin:10px 0 22px}
.slime-bilder{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.slime-bilder a{display:block;overflow:hidden}
.slime-bilder .sb-1{grid-column:1/-1}
.slime-bilder img{width:100%;aspect-ratio:16/10;object-fit:cover}
.slime-bilder .sb-2 img,.slime-bilder .sb-3 img{aspect-ratio:1}
.extras{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,3vw,32px);margin-top:26px}
.extra-bild{display:block;overflow:hidden}
.extra-bild img{width:100%;aspect-ratio:4/3;object-fit:cover}
.extra-ohne{display:grid;place-items:center;aspect-ratio:4/3}
.extra-ohne .ik{width:34%;height:34%}
.extra-text h3{display:flex;align-items:center;gap:10px;margin:16px 0 6px}
.extra-text h3 .ik{width:1.1em;height:1.1em}
.themen{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
@media (max-width:800px){.slime-in,.extras{grid-template-columns:minmax(0,1fr)}}
