@layer komponenten{
.button,button{cursor:pointer}.button{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:48px;max-width:100%;padding:.85rem 2.5rem .85rem 1.4rem;margin-top:var(--s24);background:var(--schiefer);color:var(--papier);font-weight:650;text-decoration:none;border:0;border-bottom:3px solid var(--signal);clip-path:polygon(0 0,calc(100% - 28px) 0,100% 17.4963px,100% 100%,0 100%);line-height:1.35}.button::after{content:'↗';margin-left:1.5rem;flex-shrink:0}.button:focus-visible{clip-path:none}.button:hover{background:var(--patina)}.hero .button,.dunkel .button{background:var(--papier);color:var(--tinte)}.button.alt{background:transparent;border:1px solid currentColor;color:inherit;clip-path:none}
.karte,.faktenkasten,.formular{background:var(--flaeche);border:1px solid var(--linie);padding:clamp(1.25rem,2.8vw,2.5rem);border-radius:var(--radius);box-shadow:var(--schatten-0)}.karte{position:relative;min-height:180px;border-top:3px solid var(--linie)}.karte h2{font-size:var(--untertitel);letter-spacing:-.025em}.karte p:last-child{margin-bottom:0}.karte-link,.karten>a{text-decoration:none}.karte-link::after,.karten>a::after{content:'↗';display:block;font-size:1.4rem;margin-top:var(--s24);color:var(--akzent)}.karte-link:hover,.karten>a:hover{border-top-color:var(--signal)}.faktenkasten dl{display:grid;grid-template-columns:minmax(0,1fr);margin:0}.faktenkasten dt,.faktenkasten dd{padding:var(--s12) 0;border-bottom:1px solid var(--linie);margin:0;overflow-wrap:anywhere}.faktenkasten dt{font-weight:650}.faktenkasten dd{color:var(--sekundaer)}.preis{font-size:2rem;font-weight:800;color:var(--akzent)}.badge{display:inline-block;border:1px solid currentColor;padding:.3rem .5rem;font-size:var(--text-klein);text-transform:uppercase;letter-spacing:.08em}.kontaktzeile{font-size:clamp(1.3rem,3vw,2rem);font-weight:700}
.platzhalter-foto{position:relative;min-height:220px;aspect-ratio:3/2;margin:var(--s24) 0;background:var(--schiefer);color:var(--zink-hell);display:grid;place-items:center;padding:var(--s40);text-align:center;clip-path:var(--falz);background-image:linear-gradient(90deg,#c9d0d314 1px,transparent 1px);background-size:96px 100%}.platzhalter-foto::before{content:'';position:absolute;width:96px;height:60px;left:var(--s24);top:var(--s24);border-top:1px solid var(--zink);transform:skewY(-32deg)}.platzhalter-foto>div{max-width:32ch}.platzhalter-foto figcaption{font-size:var(--text-klein);color:var(--zink-hell);margin-top:var(--s16)}.tabelle{width:100%;border-collapse:collapse;margin-block:var(--s24);font-size:clamp(.875rem,1.2vw,1.0625rem)}.tabelle th,.tabelle td{padding:.75rem .5rem;border-bottom:1px solid var(--linie);text-align:left;vertical-align:top;overflow-wrap:anywhere}.tabelle th{color:var(--akzent)}.liste{padding-left:1.2rem}.sprungmarke{display:flex;gap:var(--s16);flex-wrap:wrap}.sprungmarke a{min-height:44px;border-bottom:3px solid var(--signal)}.hinweis{border-left:3px solid var(--kupfer-neu);padding:var(--s16) var(--s24);background:var(--flaeche);margin-block:var(--s24)}
label{display:block;font-weight:600;margin-top:var(--s24)}input,select,textarea{width:100%;padding:.85rem;border:1px solid var(--sekundaer);font:inherit;color:var(--text);background:var(--flaeche);border-radius:0;min-height:48px}textarea{min-height:10rem;resize:vertical}input[type=file]{max-width:100%;font-size:.875rem}input[type=range]{padding:0;accent-color:var(--akzent)}.fehler{color:var(--fehler);margin-top:var(--s24)}.formular{position:relative;margin-top:var(--s24)}.formular:focus-within{border-color:var(--akzent)}.formular .sr-only{width:1px;min-height:0;padding:0}details{border-bottom:1px solid var(--linie);padding:var(--s16) 0}summary{cursor:pointer;font-weight:650;min-height:44px;padding-block:.5rem}details p{margin-top:var(--s16)}
@media(min-width:640px){.faktenkasten dl{grid-template-columns:minmax(8rem,35%) minmax(0,1fr)}.faktenkasten dd{padding-left:var(--s24)}}@media(prefers-color-scheme:dark){.button{background:var(--papier);color:var(--tinte)}.button:hover{background:#a4c6b4}}
}
@layer komponenten{
.hero::before,.dunkel::before{content:'';position:absolute;inset:0;opacity:.04;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23ffffff' filter='url(%23n)' d='M0 0H180V180H0Z'/%3E%3C/svg%3E")}.dunkel{position:relative}.nav>a{position:relative}.nav>a:not(.marke)::after{content:'';position:absolute;left:.65rem;right:.65rem;bottom:.25rem;height:3px;background:var(--signal);transform:scaleX(0);transform-origin:left;opacity:0;transition:transform 500ms var(--ease),opacity 500ms var(--ease);clip-path:polygon(0 0,calc(100% - 4.801px) 0,100% 3px,0 100%)}.nav>a:hover::after{transform:scaleX(1);opacity:1}
.form-falz{width:40px;height:32px;display:none;color:var(--akzent);margin-top:1rem}.vorbereitet .form-falz{display:block}.form-falz path{fill:none;stroke:currentColor;stroke-width:2.5}
}